แจกธีม หรือTemplate blogger รูปแบบ theMusic





1. อันดับแรกไปทำความเข้าใจ การติดตั้งธีม หรือTemplate blogger 

2. ไฟล์ที่ท่านได้โหลดไป สามารถอัปขึ้นแม่แบบได้เลย โดยไม่ต้องทำการแตกไฟล์ เหมือนที่โหลดเว็บอื่นมา
การอัปดูตัวอย่างข้างล่างนี้คัฟ

3. เส็จแล้วก็ลองกดดูบล็อกนะครับ

4. การเปรี่ยนรูปสไลด์ด้านบน

อันดับแรกเข้าไปที่ แก้ไข HTML  กดCtrl+F แล้วค้นหาคำนี้ https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnGPsu1AQdU5Gq1MWK6nX-pseElUG1jRU9yfQ0HvIzpOFucDGeJWZFqAkYZNegldiARgQuUY4_zC33tnHV_zlcACBxiVauQ6fkGcqUQN2SB8h6oY01vjxdr5Q1AtxWKkVByHzAFEfQI1YL/s1600/1.jpg  เมื่อเจอแล้วก็แก้ไขเป็นURL ของรูปของคุณแทนที่ URL นั้นไปเลยครับ

อธิบายเพิ่มเติม ข้อ 4 ซึ่งจะเจอตาม code ด้านล่างนี้ครับ รูปภาพจะมีอยู่ 5 รูปนะ สีแดงคือ URL ของรูปภาพ สีน้ำเงินตัวหนาคือ titleตรงรูปภาพ สีน้ำเงินตัวเล็กคือคำอธิบายตรงรูปภาพแหละครับ
<div class='fp-slides'>

 <!-- Slide 1 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnGPsu1AQdU5Gq1MWK6nX-pseElUG1jRU9yfQ0HvIzpOFucDGeJWZFqAkYZNegldiARgQuUY4_zC33tnHV_zlcACBxiVauQ6fkGcqUQN2SB8h6oY01vjxdr5Q1AtxWKkVByHzAFEfQI1YL/s1600/1.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 1 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.This theme is Bloggerized by Lasantha Bandara - Premiumbloggertemplates.com. 
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 1 Code End -->

 <!-- Slide 2 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIk_d0Y8JJfzQn1IpYTQeWhSbmTz4tNJfzE57MI7Kdzy4-dvwtkAeCRAhIsFJUZLRhjZqPkPhrZj0aJC5lp9QOzmlOwrVY90mReRMMM-qdoiSQxxnO6rmZHicmqi9bR0hjciw_XK5T2sZx/s1600/2.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 2 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.This theme is Bloggerized by Lasantha Bandara - Premiumbloggertemplates.com. 
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 2 Code End -->

 <!-- Slide 3 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhe-FHzyiDFTvTSd2N5DvnSLhhD_57jCDXJuAytB6Rakl9XqpSQ71leKY2FJNWXDiPRZ9FL3Yx1BidqoXvwNf08V0naZt3Xb7idVH0fhN2nHe1yI365tPpFE-PjYiE9QL_IRgbfyh4ijmV2/s1600/3.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 3 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.This theme is Bloggerized by Lasantha Bandara - Premiumbloggertemplates.com. 
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 3 Code End -->

 <!-- Slide 4 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiWqbLwEmijW5G1yGSt2lwDhiZdX-W9Y4VSJe3_eqEeVwpBMWggV-JCGO4srSw9-eHHNRKPHMZJX3rL4HGXk5DHZ_WE3zLg4IsYoFivYs2L6YhW49Wcv6M26ZAgmtvvgJtR8xMXrTLFhO9/s1600/4.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 4 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.This theme is Bloggerized by Lasantha Bandara - Premiumbloggertemplates.com. 
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 4 Code End -->

 <!-- Slide 5 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghmRhoqVe7DoBuXbfptp4EWc6mQdl9bv1Gnbve6smen7KxKpM9cT_2UAXPd1RjWpjsuckg42MxXQXMokI-fTe4Rget9KB61Fz8osZ3gzLclAn63CfWb7d_4pKkEd-ece3SoWtz8B88Fv_5/s1600/5.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 5 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.This theme is Bloggerized by Lasantha Bandara - Premiumbloggertemplates.com. 
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 5 Code End -->

 </div>

5. การแก้ไขแถบเมนู

อันดับแรกเข้าไปที่ แก้ไข HTML  กดCtrl+F แล้วค้นหาคำที่อยู่ตรงเมนูนั้นเช่น Business เมื่อเจอแล้วก็แก้ไขเป็นคำที่ต้องการเลย และก็ใส่ URL หรือลิ้งค์ แทนที่ เครื่องหมาย # ด้วยนะ เช่น <li><a href='http://anurak-it-health-beauty.blogspot.com/'>การสร้างบล็อก</a></li>

อธิบายเพิ่มเติม ข้อ 5 ซึ่งจะเจอตาม code ด้านล่างนี้ครับ สีแดงคือเมนูหลัก สีน้ำเงินคือเมนูย่อยจากสีแดง สีม่วงคือเมนูย่อยจากสีน้ำเงิน
<ul class='menus menu-secondary'>

 <li><a expr:href='data:blog.homepageUrl'>Home</a></li>

 <li><a href='#'>Business</a>
<ul class='children'>
<li><a href='#'>Internet</a></li>
<li><a href='#'>Market</a></li>
<li><a href='#'>Stock</a></li>
</ul>
</li>

 <li><a href='#'>Downloads</a>
<ul class='children'>
<li><a href='#'>Dvd</a></li>
<li><a href='#'>Games</a></li>
<li><a href='#'>Software</a>
<ul class='children'>
<li><a href='#'>Office</a>
</li>
</ul>
</li>
</ul>
</li>

 <li><a href='#'>Parent Category</a>
<ul class='children'>
<li><a href='#'>Child Category 1</a>
<ul class='children'>
<li><a href='#'>Sub Child Category 1</a></li>
<li><a href='#'>Sub Child Category 2</a></li>
<li><a href='#'>Sub Child Category 3</a></li>
</ul>
</li>
<li><a href='#'>Child Category 2</a></li>
<li><a href='#'>Child Category 3</a></li>
<li><a href='#'>Child Category 4</a></li>
</ul>
</li>

 <li><a href='#'>Featured</a></li>

 <li><a href='#'>Health</a>
<ul class='children'>
<li><a href='#'>Childcare</a></li>
<li><a href='#'>Doctors</a></li>
</ul>
</li>

 <li><a href='#'>Uncategorized</a></li>

</ul>
</div>
</div>
<div style='clear:both;'/>

6.  วีธีการแก้ไข Social Buttons ต่างๆ

เข้าไปที่ แก้ไข HTML  แล้วค้นหา กดCtrl+F คำว่า <div class='social-profiles-widget'>
เพียงแค่แก้ไขตรง URLสีน้ำเงิน เองครับ

อธิบายเพิ่มเติม ข้อ 6 ซึ่งจะเจอตาม code ด้านล่างนี้ครับ
<div class='span-8 last'>
<div id='top-social-profiles'>
<ul class='widget-container'>
<li class='social-profiles-widget'>
<a href='http://twitter.com/' target='_blank'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLrp4Z0bJ-n91PygusY8ii6frvZBftfvZkXSlX-b0xuz-hL_H5CXFLdKc3jU2CmY872PTE0caQCPiS0AV_zPTRO7M5klD4us6nGRwxv-Mmi9dQVtGO1doG2ZQSGf8toOnK4BzZvDHRSgA/s1600/twitter.png' title='Twitter'/></a><a href='http://facebook.com/' target='_blank'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8v95q-iM-wOx8Bj-mizVmd84M-8awh2omzni2ABbJwGDpkFC88GWl6p2UIloD0iH6PRTm3-C5_RJt_0WZ1odPNrJSdRRglQqd0sbym9ffzCmQ4094fPKZ1O1wr5ZiqbrZoS9P6sq2rgs/s1600/facebook.png' title='Facebook'/></a><a href='https://plus.google.com/' target='_blank'><img alt='Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu0DRqYZY-aFphthCdVxRtjWmgn58AjxR7ufgbrqu2nPsQr0qyCYsZILAlUR1DLu3MFgn1pYklNGFfe7aQs5BBXDMJPRIH8BpALaI8G3IyeqepzsVWVshlrqmkQHbCxqrC30uqW3F6q_E/s1600/google.png' title='Google Plus'/></a><a href='http://instagram.com/' target='_blank'><img alt='Instagram' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyGsXDl8UC4st6OkSp8ofZfXzmvr71JJ-gdqGnj5P1crGRq-V4a8uhrLiAFgE8BWNXW8hN28BfXZqdKKYjYVimKZ6artzGiwZ6SeeNZqDsXSD1x0oxJLe6Nxajl4iFau1YpCOX7ekLXtw/s1600/instagram.png' title='Instagram'/></a><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' target='_blank'><img alt='RSS Feed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9wgjH3i728Liq0nNsJyO1oyA4Yj2qTlZwxGzBQI-5pIePaMemHD7dkN0VlyYrrhMacKkg_CsEfPMA0r8idCPlG8aJqDf0qn0rOmlxYmg7Aw3pe0PwBRBtsORJ6g0B9dNc3IF6i8WcOzI/s1600/rss.png' title='RSS Feed'/></a><a href='mailto:your@email.com' target='_blank'><img alt='Email' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7vzk44lvVnFylYevcnF_URosxPafR8nUKgz-0kRZSg2QCqAVlV_7R89yUGsI08OHJhYLt6HPV7X2pKx0XAXEmHKrOAcZBOihvHF_sjVNyasyAlEg9XxVlMxkyIHq0wrx_Hdi_W8m0rbw/s1600/mail.png' title='Email'/></a>
</li>
</ul>
</div>
</div>

ไม่ยากเลยเนอะ สอบถามเพิ่มเติม ให้คอมเม้น ใต้บทความนี้ครับ
เขียนโดย
ป้ายกำกับ: , ,

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

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

สมัครสมาชิก: ส่งความคิดเห็น (Atom)