ทำป้ายกำกับแบบเท่ๆ ให้กับล็อกเราดีกว่า

วิธีทำป้ายกำกับใต้ภาพ หรือ ป้ายกำกับใต้หัวข้อบทความ ในหน้าแรกของเว็บ บล็อก เพื่อแยกหมวดหมู่ [LABEL] ให้กับบทความ ดังภาพตัวอย่าง
โค้ด

.post-labels
#viewers

ส่วนที่1
.post-labels{position:relative;margin:0;padding:0}
.post-labels a{float:left;height:18px;line-height:18px;position:relative;font-size:11px;margin-top:4px;margin-left:15px;background:#eb4938;color:#fff;text-decoration:none;-moz-border-radius-bottomright:3px;-webkit-border-bottom-right-radius:3px;border-bottom-right-radius:3px;-moz-border-radius-topright:3px;-webkit-border-top-right-radius:3px;border-top-right-radius:3px;padding:0 10px}
.post-labels a:before{content:"";float:left;position:absolute;top:0;left:-9px;width:0;height:0;border-color:transparent #eb4938 transparent transparent;border-style:solid;border-width:9px 9px 9px 0}
.post-labels a:after{content:"";position:absolute;top:7px;left:0;float:left;width:4px;height:4px;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;background:#fff;-moz-box-shadow:-1px -1px 2px #666;-webkit-box-shadow:-1px -1px 2px #666;box-shadow:-1px -1px 2px #666}
.post-labels a:hover{background:#555}
.post-labels a:hover:before{border-color:transparent #555 transparent transparent}

ส่วนที่2
#viewers{float:left;width:100%;font:12px Arial;padding-top:3px;border-top:1px solid #bbb;margin:0;background:#eee}
.readmorecontent{float:right;margin:0;padding:3px 10px;0}

ทั้งสองอยุ่ก่อนหน้า ]]></b:skin>

ส่วนที่3
                        <div class='post-footer'>
                          <div id='viewers'>

                            <span class='post-labels'>
                              <b:if cond='data:post.labels'>
                                <b:loop values='data:post.labels' var='label'>
                                  <a expr:href='data:label.url + &quot;?&amp;max-results=5&quot;' rel='tag'>
                                    <data:label.name/>
                                  </a>
                                </b:loop>
                              </b:if>
                            </span>
                          </div>
                        </div>

ลิงก์ไปยังย่อหน้า หรือหัวข้อ ภายในหน้าเดียวกันอย่างรวดเร็ว

โค้ดเพิ่มลิงก์ ไปยังย่อหน้า หรือหัวข้อ ภายในหน้าเดียวกันอย่างรวดเร็ว ด้วยการคลิกลิงก์ คุณไม่ต้องเลื่อน หรือหา ให้เสียเวลา คุณสามารถคลิกข้ามไปยังหัวข้อที่ต้องการได้ทันที

  เพียงคลิกลิงก์ ก็จะไปยังหัวข้ออย่างรวดเร็ว เพื่อง่าย และสะดวกต่อผู้อ่านบทความ ในบล็อก หรือว็บไซต์ ที่มีเนื้อหา หัวข้อ รายละเอียดเยอะๆ ในบางทีเราก็ต้องการข้ามไปยังหัวข้อที่เราต้องการอ่านเท่านั้น แต่การเลื่อนหาทีประโยคคงเสียเวลา เมื่อคุณใช้โค้ดนี้จะสะดวกสำหรับผู้เข้าอ่านเนื้อหาในเว็บ หรือบล็อกของคุณ อย่างมากเลยครับ
คลิกดูตัวอย่าง
หัวข้อที่1หัวข้อที่2 /หัวข้อที่3 /หัวข้อที่4 /หัวข้อที่5/หัวข้อที่6/หัวข้อที่7/หัวข้อที่8/หัวข้อที่9


คัดลอกโค้ดไปใช้ได้เลยครับ
<a href="http://webblog2u.blogspot.com/2016/03/blog-post.html#9">หัวข้อที่9</a>
<a name="9"></a> หัวข้อที่9

วิธีทำ
ส่วนที่1 สร้างลิงก์แบบปกติ เช่น (หัวข้อที่9)
-ส่วนประกอบ <a href="ใส่urlของหน้า#เลข">หัวข้อที่9</a>
-ลิงก์คือ http://webblog2u.blogspot.com/2016/03/blog-post.html#9
-โค้ดHTMLคือ
<a href="http://webblog2u.blogspot.com/2016/03/blog-post.html#9">หัวข้อที่9</a>

ส่วนที่2 หัวข้อหรือย่อหน้า ที่กำหนดไว้ (คลิก html ก่อนวางโค้ด)
-ส่วนประกอบ <a name="เลข"></a> หัวข้อที่9
-โค้ดที่ใช้วางก่อนหน้าหัวข้อ <a name="9"></a> หัวข้อที่9


ตัวอย่าง

หัวข้อที่1
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่2
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่3
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่4
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่5
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่6
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่7
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่8
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่9
รายละเอียด
เนื้อหาอื่นๆ
บลาๆๆๆๆ

หัวข้อที่1หัวข้อที่2 /หัวข้อที่3 /หัวข้อที่4 /หัวข้อที่5/หัวข้อที่6/หัวข้อที่7/หัวข้อที่8/หัวข้อที่9
วิธีทำ / ไปบนสุด

วิธีทำหน้าเว็บให้เป็นสีขาวดำ

วิธีทำหน้าเว็บให้เป็นสีขาวดำ เทา
ขั้นตอน
ไปที่แม่แบบ >>แก้ไข html
1.ค้นหา ]]></b:skin>
2.คัดลอกโค้ด

html {
filter: grayscale(100%);
filter: gray;
-moz-filter: grayscale(100%);
-webkit-filter: grayscale(100%);
}

3.วางโค้ดวางลงก่อนหน้า ]]></b:skin>
4.บันทึกแม่แแบบ เสร็จแล้วครับ

ตัวอย่าง
html {
filter: grayscale(100%);
filter: gray;
-moz-filter: grayscale(100%);
-webkit-filter: grayscale(100%);
}
]]></b:skin>
คัดลอกโค้ดไปใช้ได้เลยครับ

**ถ้าหากมืดเกินไปให้ปรับลดลงเป็น90%,80%ตามเหมาะสม
**หากต้องการกลับมาเหมือนเดิมให้ลบโค้ดออกครับ

แก้ปัญหา Line หาย

แก้ปัญหา เวลาเปลี่ยนเครื่อง เปลี่ยนเบอร์ รีเซ็ตเครื่อง สมาร์ทโฟนหาย แล้วLineก็หายไปด้วย
เพื่อนหาย กลุ่มหาย เข้าๆออกๆจากกลุ่ม ต้องแอดใหม่ประจำ

แก้ปัญหาง่ายๆขั้นตอนดังนี้
1.ลงทะเบียนบัญชีอีเมลล์
-เข้าไปที่รูปฟันเฟือง>>บัญชี>>ลงทะเบียนบัญชีอีเมลล์>>ใส่อีเมลล์ของท่าน

2.เปิดใช้งานLineด้วยคอมพิวเตอร์ หรือโน๊ตบุ๊ค

2.1หากมีLineติดตั้งไว้แล้วก็Loginเข้าใช้ได้เลย
ท่านสามารถLoginด้วยอีเมลล์ หรือLoginด้วยเบอร์โทร ก็ได้ครับ

2.2ถ้าหากยังไม่มีLineในเครื่อง ให้ติดตั้งก่อน
ดาวน์โหลดได้ที่ https://line.me/th/download

**นอกจากนี้ท่านยังสามารถเปลี่ยนเบอร์ หรือเปลี่ยน อีเมลล์ ในบัญชี Lineได้อีกด้วยครับ โดยทุกอย่างก็ปกติ

ต่อไปนี้ หากเปลี่ยนเครื่อง เปลี่ยนเบอร์ รีเซ็ตเครื่อง Lineท่านจะไม่หายแล้วครับ

Area Croods Map

code area croods map กำหนดปุ่มคลิกตำแหน่งในแผนที่ แล้วจะลิงก์ไปยังหน้าเว็บที่ต้องการ
"rect"  คือ สี่เหลี่ยม
"circle" คือ วงกลม
ภาพอธิบายการกำหนดตำแหน่ง


คัดลอกโค้ดไปใช้ได้ครับ
<img alt="Planets" height="222" src=" ใส่ URLภาพ " usemap="#planetmap" width="309" />
<map name="planetmap">
<area alt="นครปฐม" coords="33,151,113,30" href="ใส่URLลิงก์" shape="rect"></area>
<area alt="ปทุมธานี" coords="136,80,280,24" href="ใส่URLลิงก์" shape="rect"></area>
<area alt="กรุงเทพฯ href=" coords="180,90,280,146" href="ใส่URLลิงก์" shape="rect"></area>
<area alt="สมุทรปราการ" coords="176,160,280,204" href="ใส่URLลิงก์" shape="rect"></area>
<area alt="นนทบุรี" coords="152,96,25" href="ใส่URLลิงก์" shape="circle"></area>
<area alt="สมุทรสาคร" coords="96,184,30" href="ใส่URLลิงก์" shape="circle"></area>
</map>

*ท่านสามารถดัดแแปลงไปใช้กับแผนที่ แบบอื่นๆได้ตามความเหมาะสม
*ขนาดพื้นที่  height และ width ควรเท่ากันกับขนาดภาพ
ลองคลิกดูครับ
Planets

นครปฐม
ปทุมธานี
กรุงเทพฯ href=
สมุทรปราการ
นนทบุรี
สมุทรสาคร

โค้ดเล่นไฟล์สกุล m3u8 บนเว็บไซต์

ไฟล์สกุล .m3u8 เป็นรูปแบบไฟล์คอมพิวเตอร์ที่มีรายการเพลง มัลติมีเดีย หรือสำหรับรายการสด Live broadcast จากสถานีวิทยุ โค้ดนี้สามารถฟังได้ทั้งเครื่องคอมพิวเตอร์ และสมาร์ทโฟน ทุกระบบ

คัดลอกโค้ดไปใช้ได้เลยครับ
<script src="https://jwpsrv.com/library/iCNxUOakEeKTGxIxOQulpA.js"></script>
    <script>jwplayer.key="IlVNgC+NtBYXe66VHWfLpLzgHU7cOg7MBhdlHA=="; </script>
    <br />
<div id="mediaspace">
</div>
<script>
        var createPlayer = function ()
        {
          jwplayer('mediaspace').setup({
             playlist: [{ file: 'ใส่URL ของไฟล์ที่นี่' }],
             width: '300',
             height: '30',
             autostart: true,
             aspectratio: '16:9',
             primary: 'html5',
             androidhls: true,
    events:{
    onReady:function(){
     jwplayer().setVolume(100);
    }
   }
          });
        }
        createPlayer();
    </script>

ตัวอย่าง
สถานีวิทยุเอฟเอ็ม 87.5 วิทยุรัฐสภา
http://202.57.162.55:1935/live04/live04/playlist.m3u8


วันนี้