Theme ที่เลือกในการออกแบบ คือ Iribbon Theme ที่เราสามารถตกแตง ไดทั้ง Slide ,Box link , Header มีใหเลือกใช Social Network Icon รวมถึงมีเครื่องมือ Iribbon Option ที่ชวยในการตกแตง เพิ่มขึ้นอีกดวย
ขั้นตอนการตกแตง Social Network Icon แบบ Icon Social Network โดยเริ่มตน เขามาในสวน IRibbon Option และทําการเลือก Header จะมีใหเลือก Icon Social Network โดยจะมีรูปแบบ ในเลือก 3 รูปแบบ โดยการปรับแตง Icon Social Network นั้นเราจะทําการตกแตง และแทนคาอันเดิม
ขั้นตอนแรก ทําการเช็คดูวาไฟลรูปภาพที่เราจะทําการตกแตงนั้นอยูที่ใด โดยทําการ คลิกขวา และเลือก (View Image Info) 1
3
2
ขั้นตอนที่สอง ก็จะปรากฏหนาตาง และขอมูลรูปภาพ (หมายเลข 1 ) ตอไปทําการ เขาไปหาไฟลที่อยูดังกลาว หมายเลขที่ 1 แสดงที่อยูของรูปภาพ หมายเลขที่ 2 แสดงรูปภาพ
หมายเลขที่ 3 แสดงประเภทของไฟล 4
ขั้นตอนที่สาม หลังจากที่หาที่อยูของไฟลดังกลาวแลว นั้น ขั้นตอนตอไปคือการ ตกแตง อยางที่กลาวในตอนตนวา เราตองการแทนคา เราก็ทําการแกไขไฟลโดยใช Photoshop ในการแกไข หมายเลขที่ 4 แสดงภาพ Icon Social Network รูปแบบเกามาพรอมกับ Theme
5.
ขั้นตอนที่สี่ หลังจากทําการแกไขเสร็จแลว(ดังภาพ) ใหทําการเซฟไฟลทับไฟลตัว เดิมแลวทําการเปดไปที่หนาตางของ Icon Social Network และทําการกด F5 หนึ่งครั้ง หมายเลขที่ photoshop
5
แสดงภาพ
Icon
ที่ทําการแทนคา
ดวยโปรแกรม
Before
After
ขั้นตอนที่หา หลังจากกด F5 แลว Icon Social Network ที่เราทําการแทนคานั้นก็จะ ปรากฏ เปรียบเทียบจากภาพเกา แตถึงอยางนั้น Icon Social Network ที่เราทําการ ตกแตงก็ยังไมสามารถใชไดจริง ตองทําการแกไขอีกในสวนของการแสดงผลที่หนาเว็บ ของเรา
6.
ขั้นตอนที่หก ในสวนการแสดงผล ของ Icon Social Network นั้น ใหเราเขาไปที่ Theme/iribbon/cyberchimps/lib/image/social/ และทําการเลือกรูปแบบของ Icon ที่ เราจะทําการแกไข ในสวนนี้ เลือก รูปแบบ Round หมายเลขที่ 6 แสดงภาพ Icon ที่ยังไมไดทําการแทนคา
ขั้นตอนที่เจ็ด จากนั้นก็เปดดวยโปรแกรม Photoshop เพื่อทําการแทนคา Icon ตัวเดิม
7.
ขั้นตอนที่แปด แทนคาจนครบทุก Icon คือเสร็จสิ้นแลว หมายเลขที่ 7 แสดงภาพ Icon ที่ไดทําการแทนคาเรียรอยแลว
8.
ขั้นตอนที่เกา หลังจากแทนคาจนหมดแลว ใหมาที่หนาตางของ Iribbon Option ใน สวนนี้เราสามารถเลือกไดวาจะใหโชว Icon Social Network ที่เราทําการแทนคา อะไรบาง หลังจากนั้นกด Save Option หมายเลขที่ 8 แสดงภาพ การตั้งคาเปด – ปด ดวยเครื่องมือ Iribbon Option
9.
ขั้นตอนที่สิบ หลังจากทําตามขั้นตอนแลว จะเห็นไดวา Icon Social Network ได เปลี่ยนไปแลว เสร็จสิ้นขั้นตอนการแทนคา หมายเลขที่ 9 แสดงภาพ Icon Social Network ที่ทําการแทนคาเรียบรอยแลว
การเพิ่มเติมในสวนของลิงค(Link)
10.
ขั้นตอนแรก ในหัวขอรูปแบบบล็อก ใหเลือก Widgets ในสวนนี้ใหเราทําการเพิ่มใน หัวขอของ ลิงค กอนโดยทําการลากหัวขอของลิงคไปไวทางดานขวามือ ดังภาพ หมายเลขที่ 10 แสดงภาพ แทบลิงค ที่ทําการลากไปยังแทบเมนูดานขาง
11.
ขั้นตอนที่สอง ใหเขามาในสวนหนาควบคุม แลวทําการเลือกในหัวขอลิงก ในสวนนี้ จะมีลิงกตางๆมากมายในที่นี้เราจะทําการเพิ่มเติมใหม ใหกดเพิ่มใหม หมายเลขที่ 11 แสดงภาพ รายชื่อลิงคที่มี ณ ขณะนี้
12.
ขั้นตอนที่สาม จะปรากฏหนาตางของการเพิ่มลิงก ใหกรอกลายละเอียด ในสวนของ ชื่อ , ที่อยูเว็บกอน สวนในหัวขอ ที่อยูรูปภาพใหเราทําการหาภาพที่จะทําการเพิ่มจาก Google ไดเลย หมายเลขที่ 12 แสดงภาพ การกรอกลายละเอียด เพิ่มลายละเอียดของ ลิงค
13.
14.
ขั้นตอนที่สี่ หลังจากหาภาพไดแลวในทําการ Copy URL ของเว็บรูปภาพนั้น ดังภาพ หมายเลขที่ 13 แสดง URL ที่อยูของภาพที่จะทําการเพิ่ม ลิงค หมายเลขที่ 14 แสดงรูปภาพที่จะทําการเพิ่มลงไปใน ลิงค
15. 16.
ขั้นตอนที่หา ใหนํา URL ที่ไดไปวางที่ ชองการกรอกขอมูลของหัวขอ ที่อยูรูปภาพ ในหัวขอการจัดอันดับหมายถึงจะใหเราจัดอันดับของรูปภาพลิงกนี้อยูอันดับที่เทาไหร นับ จากลางขึ้นบน จากนั้นกดเพิ่มลิงก หมายเลขที่ 15 แสดง ชองสําหรับใส URL ของรูปภาพ หมายเลขที่ 16 แสดง การจัดลําดับของ ลิงครูปภาพ
17.
ขั้นตอนที่หก จะปรากฏลิงกรูปภาพที่เราทําการเพิ่มไป เปนอันเสร็จสิ้นการเพิ่มเติมลิงก รูปภาพ หมายเลขที่ 17 แสดงลิงครูปภาพ ที่ทําการเพิ่มเรียบรอยแลว
การแทนคาในสวนของสไลด ขั้นตอนตอมาจะเปนการแทนคาของตัวสไลด
18.
ขั้นตอนแรก ใหเขาไปที่ Theme/iribbon/Image/Branding ภายในจะเปนรูปภาพใชสําหรับ เปนภาพสไลด หมายเลขที่ 18 แสดงโฟเดอรที่อยูของภาพสไลด
19.
20.
ขั้นตอนที่สอง เปดไฟล Slide1.jpeg ดวยโปรแกรม Photoshop เพื่อทําการตกแตง หมายเลขที่ 19 แสดงไฟลภาพสําหรับการตกแตง หมายเลขที่ 20 แสดงไฟลภาพที่ทําการเปดดวยโปรแกรม Photoshop
21.
ขั้นตอนที่สาม หลังจากตกแตงเสร็จแลวก็ทําการเซฟ แทนคาตัวเดิมของ Slide1.jpeg หมายเลขที่ 21 แสดงไฟลภาพที่ทําการตกแตงเรียบรอยดวยโปรแกรม Photoshop
22.
Before
23.. After
หมายเลขที่ 22 แสดงไฟลภาพที่ กอน ทําการตกแตงดวยโปรแกรม Photoshop หมายเลขที่ 23 แสดงไฟลภาพที่ หลัง ทําการตกแตงดวยโปรแกรม Photoshop
24.
ขั้นตอนที่สี่ เสร็จสิ้นการแทนคาใหหัวขอ Slide หมายเลขที่ 24 แสดงภาพหลังจากแทนคาเรียบรอย
25.
ขั้นตอนแรก ใหคลิกเขา Iribbon Option จะปรากฏหนาตางดังภาพ หมายเลขที่ 25 แสดงหนาตาง Iribbon Option
26. 27.
ขั้นตอนที่สอง ใหทําการเลือกหัวขอ Blog จะมีใหเลือกใสรูปภาพพรอมเพิ่มเติมใน สวนของลิงค URL ของภาพSlide นั้นๆอีกดวย ใหทําการกดที่ปุม Upload หมายเลขที่ 26 แสดงหนาตาง Iribbon Option หัวขอ Blog หมายเลขที่ 27 แสดงภาพของ Slide ที่มีอยูกอนแลว
ขั้นตอนที่สาม หลังจากกดปุม Upload แลวจะปรากฏหนาตางคลังภาพ ภายในจะมี รูปภาพที่เราไดเคยทําการอัพไวแลว จากนั้นกดที่ อัปโหลดไฟล
ขั้นตอนที่สี่ กดที่ปุม เลือกหลายไฟล เพื่อทําการอับโหลดไฟลภาพจากคอมของเรา เขาสูเว็บ
ขั้นตอนที่หา ในขั้นตอนนี้ใหทําการเลือกไฟลรูปภาพในคอมของเรา ที่ตองการจะอับ โหลด
ขั้นตอนที่หก หลังจากอับโหลดแลว ภาพของเราจะปรากฏอยูใน คลังภาพ แลวทํา การกดปุม ใสไฟลในเรื่อง
ขั้นตอนที่เจ็ด ภาพของเราที่อับขึ้นไปก็จะปรากฏเชนเดียวกับการแทนคา
การเพิ่ม Video จาก YouTube
ขั้นตอนแรก เขามาที่ การเขียนเรื่องใหม แลวทําการใสหัวเรื่องตามปกติ จากนั้นให ทําการกดที่ ปุม ตัวอักษรเพื่อเตรียมพรอมสําหรับการเพิ่มเติม Video
ขั้นตอนที่สอง หลังจากกดปรับเปลี่ยนเปนหนาจอ ตัวอักษรแลว ใหไปที่ YouTube เพื่อเลือกหา Video ที่เราตองการ
ขั้นตอนที่สาม หลังจากหา Video ที่ตองการแลว ใหทําการเลือกที่ Share
ขั้นตอนที่สี่ จากนั้นกดที่ Embed จะปรากฏ Code ใหทําการ Copy Code นั้นมา
ขั้นตอนที่หา นํา Code ที่ไดมาวางไวที่ หนาตางการเขียนเรื่องของเรา และใน ชอง Visual นั้นเราสามารถปรับขนาดของ คลิป Video ไดดวย
ขั้นตอนที่หก เสร็จสิ้นสําหรับการอับ คลิป วิดีโอ จาก Youtube