Hadee - PSU Trang 5350110155: Tech&Tips

Tech&Tips

รวมเทคนิค - ลูกเล่นต่างๆที่ใช้ในการทำเว็บไซต์

   เทคนิคที่ 1 : "วิธีสร้าง Like Box ของเฟสบุคติดหน้าเว็บ"



   ทุกท่านอาจจะเคยเห็นกล่องในลักษณะข้างบนมาบ้างแล้ว วันนี้เรามาดูวิธีการทำเองบ้างดีกว่าครับ มีวิธีการดังนี้

เข้าไปที่ https://developers.facebook.com/docs/reference/plugins/like-box
ใส่ที่อยู่แฟนเพจในช่องกรอก URL
[Width] กำหนดความกว้าง
[Color scheme] เปลี่ยนสี
[Show Faces] เลือกว่าจะให้แสดงหน้าสมาชิกหรือไม่
[Border Color] กรอบสี สำหรับเปลี่ยนสีกรอบ แต่ต้องกำหนดค่าสีเป็น CSS แต่จริงๆแล้วไม่จำเป็นต้อใส่ก็ได้
[Stream] แสดงข่าวที่โพสในแฟนเพจ
[Header] แสดงหัวข้อหรือไม่
เสร็จแล้วกด Get Code

เทคนิคที่ 2 : "การใส่ข้อความทักทายตามเวลา + ปฏิทินบนหน้าเว็บ"

ต้องการให้แสดงข้อความและปฏิทินที่ไหนให้นำ CODE ด้านล่าง ไปไว้ที่นั่นครับ <body> นะครับ

<script LANGUAGE="JavaScript">
<!-- Begin
function greeting() {
var today = new Date();
var hrs = today.getHours();
document.writeln("<center>
");

document.write("");
document.writeln("<br>");
document.write("<h1>
สวัสดี "); 
if (hrs < 6)
document.write("วันใหม่");
else if (hrs < 12)
document.write("ตอนเช้า");
else if (hrs <= 18)
document.write("ตอนบ่าย");
else
document.write("ตอนเย็น");
document.writeln("!</H1>");
document.write("คุณเข้าชมหน้านี้ในวันที่ ");
dayStr = today.toLocaleString();
document.write(dayStr);
document.writeln("</CENTER>");
}
function montharr(m0, m1, m2, m3, m4, m5, m6, m7, m8, m9, m10, m11)
{
this[0] = m0;
this[1] = m1;
this[2] = m2;
this[3] = m3;
this[4] = m4;
this[5] = m5;
this[6] = m6;
this[7] = m7;
this[8] = m8;
this[9] = m9;
this[10] = m10;
this[11] = m11;
}
function calendar()
{
var monthNames = "JanFebMarAprMayJunJulAugSepOctNovDec";
var today = new Date();
var thisDay;
var monthDays = new montharr(31, 28, 31, 30, 31, 30, 31, 31, 30,31, 30, 31);
year = today.getYear() + 0;
thisDay = today.getDate();
if (((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0))
monthDays[1] = 29;
nDays = monthDays[today.getMonth()];
firstDay = today;
firstDay.setDate(1); 
testMe = firstDay.getDate();
if (testMe == 2)
firstDay.setDate(0); 
startDay = firstDay.getDay();
document.writeln("<center>
");
document.write("<table BORDER>");
document.write("
<tr><th COLSPAN=7>");
document.write(monthNames.substring(today.getMonth() * 3,
(today.getMonth() + 1) * 3));
document.write(". ");
document.write(year);
document.write("
<tr><th>sun<th>mon<th>tue<th>wed<th>thu<th>fri<th>sat");
document.write("
<tr>");
column = 0;
for (i=0; i<startDay; i++) {
document.write("<td>");
column++;
}
for (i=1; i<=nDays; i++) {
document.write("<td>");
if (i == thisDay)
document.write("<font COLOR=\"#FF0000\">")
document.write(i);
if (i == thisDay)
document.write("</FONT>")
column++;
if (column == 7) {
document.write("
<tr>"); 
column = 0;
}
}
document.write("</TABLE>");
document.writeln("</CENTER>");
}
greeting();
document.write("</br>");
calendar();
document.write("");
// End -->
</SCRIPT>

ภาพตัวอย่าง

เทคนิคที่ 3 : "การทำภาพสไลด์"

คลิกเข้าเว็บไซต์ ht tp://widget.sanook.com/slide-diy/slide.php แล้วเริ่มทำการตกแต่งสไลด์ ตาม

ขั้นตอนดังต่อไปนี้

เมื่อทำการอัพโหลดรูปภาพได้ตามความต้องการแล้ว ให้ทำการตกแต่งรูปภาพตามขั้นตอนต่อไปนี้

เมื่อตกแต่งรูปภาพเสร็จเรียบร้อย ให้คลิกบันทึกเพื่อไปยังหน้ารับโค๊ด

จากนั้นให้นำโค๊ดที่ได้ไปวางที่เว็บไซต์ของเรา โดยก่อนวางให้คลิกปุ่ม Source แล้วทำการวางโค๊ด

ตัวอย่างภาพที่ได้

ที่มา : http://www.admin.in.th/index.php?board=105.0
http://www.codetukyang.com/java/
http://oxygen.readyplanet.com/index.php?lay=show&ac=article&Id=539362549&Ntype=777

ไม่มีความคิดเห็น:

แสดงความคิดเห็น

สมัครสมาชิก: บทความ (Atom)