{"id":5401,"date":"2025-09-25T17:00:51","date_gmt":"2025-09-25T10:00:51","guid":{"rendered":"https:\/\/siammakemoney.com\/?p=5401"},"modified":"2025-11-22T17:45:43","modified_gmt":"2025-11-22T10:45:43","slug":"blogger-make-blank-template","status":"publish","type":"post","link":"https:\/\/siammakemoney.com\/ja\/blogger-make-blank-template\/","title":{"rendered":"\u521d\u5fc3\u8005\u5411\u3051Blogger\u30c6\u30fc\u30de\u4f5c\u6210\u30ac\u30a4\u30c9\uff1aBlogger\u306e\u7a7a\u767d\u30da\u30fc\u30b8"},"content":{"rendered":"\n<h2 class=\"wp-block-heading has-text-color has-link-color wp-elements-597ea9a5266b82d49b3240e732762eb9\" style=\"color:#e36d27\">\u0e04\u0e39\u0e48\u0e21\u0e37\u0e2d\u0e2a\u0e23\u0e49\u0e32\u0e07 \u0e18\u0e35\u0e21 Blogger<\/h2>\n\n\n\n<p>\u0e04\u0e39\u0e48\u0e21\u0e37\u0e2d\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e1c\u0e39\u0e49\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e43\u0e19\u0e01\u0e32\u0e23\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e18\u0e35\u0e21 Blogger \u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e1e\u0e37\u0e49\u0e19\u0e10\u0e32\u0e19\u0e02\u0e2d\u0e07\u0e42\u0e04\u0e49\u0e14 XML \u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e43\u0e19 Blogger \u0e23\u0e27\u0e21\u0e16\u0e36\u0e07\u0e27\u0e34\u0e18\u0e35\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e41\u0e15\u0e48\u0e07 CSS \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a\u0e2b\u0e19\u0e49\u0e32\u0e15\u0e32\u0e02\u0e2d\u0e07\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e43\u0e2b\u0e49\u0e2a\u0e27\u0e22\u0e07\u0e32\u0e21\u0e41\u0e25\u0e30\u0e15\u0e2d\u0e1a\u0e2a\u0e19\u0e2d\u0e07\u0e15\u0e48\u0e2d\u0e2d\u0e38\u0e1b\u0e01\u0e23\u0e13\u0e4c\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e19\u0e2d\u0e01\u0e08\u0e32\u0e01\u0e19\u0e35\u0e49\u0e22\u0e31\u0e07\u0e41\u0e19\u0e30\u0e19\u0e33\u0e40\u0e01\u0e35\u0e48\u0e22\u0e27\u0e01\u0e31\u0e1a\u0e2d\u0e07\u0e04\u0e4c\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e2b\u0e25\u0e31\u0e01\u0e17\u0e35\u0e48\u0e2a\u0e33\u0e04\u0e31\u0e0d \u0e40\u0e0a\u0e48\u0e19 \u0e2a\u0e48\u0e27\u0e19\u0e2b\u0e31\u0e27 (header), \u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32 (content), \u0e41\u0e16\u0e1a\u0e14\u0e49\u0e32\u0e19\u0e02\u0e49\u0e32\u0e07 (sidebar) \u0e41\u0e25\u0e30\u0e2a\u0e48\u0e27\u0e19\u0e17\u0e49\u0e32\u0e22 (footer) \u0e1e\u0e23\u0e49\u0e2d\u0e21\u0e17\u0e31\u0e49\u0e07\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e27\u0e34\u0e14\u0e40\u0e08\u0e47\u0e15\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e43\u0e19 Blogger \u0e0b\u0e36\u0e48\u0e07\u0e0a\u0e48\u0e27\u0e22\u0e43\u0e2b\u0e49\u0e1c\u0e39\u0e49\u0e2d\u0e48\u0e32\u0e19\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e40\u0e02\u0e49\u0e32\u0e43\u0e08\u0e41\u0e25\u0e30\u0e19\u0e33\u0e44\u0e1b\u0e1b\u0e23\u0e30\u0e22\u0e38\u0e01\u0e15\u0e4c\u0e43\u0e0a\u0e49\u0e43\u0e19\u0e01\u0e32\u0e23\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e18\u0e35\u0e21\u0e02\u0e2d\u0e07\u0e15\u0e19\u0e40\u0e2d\u0e07\u0e44\u0e14\u0e49\u0e07\u0e48\u0e32\u0e22\u0e02\u0e36\u0e49\u0e19.<\/p>\n\n\n\n<h2 class=\"wp-block-heading has-text-color has-link-color wp-elements-02c97c8ca9b69cbbdb9f288131871b1b\" style=\"color:#dd5500;font-size:31px\"><em>\u0e17\u0e33\u0e2b\u0e19\u0e49\u0e32 Blank Page \u0e41\u0e1a\u0e1a \u201c\u0e27\u0e48\u0e32\u0e07\u0e08\u0e23\u0e34\u0e07\u0e46\u201d \u0e14\u0e49\u0e27\u0e22 HTML<\/em><\/h2>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-476f16684185ef0ac0f7e18999d1d625\" style=\"color:#206221;font-size:32px\">1. \u0e42\u0e04\u0e49\u0e14 \u0e18\u0e35\u0e21 Blogger \u0e27\u0e48\u0e32\u0e07\u0e40\u0e1b\u0e25\u0e48\u0e32 blogger blank page<\/h3>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-6719ece987120a4f8389718d073da7ef\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml' xmlns:b='http:\/\/www.google.com\/2005\/gml\/b' xmlns:data='http:\/\/www.google.com\/2005\/gml\/data' xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n &lt;head&gt;\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt; \n  &lt;b:if cond='data:blog.isMobile'&gt; \n   &lt;meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'\/&gt; \n  &lt;b:else\/&gt; \n   &lt;meta content='width=1100' name='viewport'\/&gt; \n  &lt;\/b:if&gt; \n  &lt;b:include data='blog' name='all-head-content'\/&gt;\n  &lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n  <strong>&lt;b:skin&gt;\n   &lt;!&#91;CDATA&#91;\/* \n    ----- css Yours here -----\n   ]]>\n  &lt;\/b:skin&gt;<\/strong>\n &lt;\/head&gt;\n &lt;body&gt;\n  &lt;b:section class='main' id='main' showaddelement='yes'\/&gt;\n  &lt;!-- Please Keep The Credits --&gt;\n  &lt;center&gt;&lt;a href=\"\/\/siammakemoney.com\/\"&gt;siammakemoney.com\/&lt;\/a&gt;&lt;\/center&gt;\n &lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n<style scoped>\n            .gc-box{margin-bottom:30px;padding:20px;border-left:5px solid transparent;line-height:24px}.gc-box .label-info{background-color:#5bc0de;display:inline-block;margin:0 5px 10px 0;padding:3px 6px;font-size:75%;font-weight:700;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25em;line-height:14px}.gc-box.green_type{color:#3c763d;background-color:#dff0d8;border-color:#cae6be}.gc-box.blue_type{color:#31708f;background-color:#d9edf7;border-color:#bcdff1}.gc-box.red_type{color:#a94442;background-color:#f2dede;border-color:#e8c4c4}.gc-box.grey_type{background:#ddd;border-color:#ccc;color:#444}.gc-box.info_type{color:#155724;background-color:#d4edda;border-color:#c3e6cb}.gc-box.info_type svg{fill:#30a030}.gc-box.download_type{color:#004085;background-color:#cce5ff;border-color:#b8daff}.gc-box.download_type svg{fill:#3a9aff}.gc-box.update_type{color:#004458;background-color:#d9edf7;border:1px solid #bce8f1}.gc-box.notice_type{color:#856404;background-color:#fff3cd;border-color:#ffeeba}.gc-box.notice_type svg{fill:#f7a000}.gc-box.error_type{color:#721c24;background-color:#f8d7da;border-color:#f5c6cb}.gc-box.error_type svg{fill:#c70000}.gc-box.border_type{border:2px solid #ddd}.gc-box.icon_type{display:flex}.gc-box.icon_type .gc-box-icon{width:28px}.gc-box.icon_type .gc-box-text{flex-grow:1;margin:0 15px}.gc-box-text > *{margin-bottom: 20px;}\n        .gc-box-text > *:last-child{margin-bottom:0}        \n        <\/style><div class=\"gc-box info_type icon_type\" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><svg x=\"0px\" y=\"0px\" viewBox=\"0 0 512 512\"> <g><g> <path d=\"M256,0C114.497,0,0,114.507,0,256c0,141.503,114.507,256,256,256c141.503,0,256-114.507,256-256 C512,114.497,397.492,0,256,0z M256,472c-119.393,0-216-96.615-216-216c0-119.393,96.615-216,216-216 c119.393,0,216,96.615,216,216C472,375.393,375.384,472,256,472z\"\/> <\/g> <\/g> <g> <g> <path d=\"M256,214.33c-11.046,0-20,8.954-20,20v128.793c0,11.046,8.954,20,20,20s20-8.955,20-20.001V234.33 C276,223.284,267.046,214.33,256,214.33z\"\/> <\/g> <\/g> <g> <g> <circle cx=\"256\" cy=\"162.84\" r=\"27\"\/> <\/g> <\/g> <\/svg><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<p>&#8212;&#8211; css Yours here &#8212;&#8211; \u0e43\u0e2a\u0e48 css\u0e02\u0e2d\u0e07\u0e04\u0e38\u0e13\u0e44\u0e14\u0e49\u0e08\u0e32\u0e01\u0e17\u0e35\u0e48\u0e19\u0e35\u0e48<\/p>\n\n<\/div>\n\t\t<\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h2 class=\"wp-block-heading has-text-color has-link-color wp-elements-73654bad26fef3a1c575c3339b28625a\" style=\"color:#0f6e67\">\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22\u0e42\u0e04\u0e49\u0e14\u0e1e\u0e37\u0e49\u0e19\u0e10\u0e32\u0e19<\/h2>\n\n\n<div class=\"gc-box download_type icon_type\" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><svg viewBox=\"0 0 612 612\"> <g> <g> <g> <path d=\"M403.939,295.749l-78.814,78.833V172.125c0-10.557-8.568-19.125-19.125-19.125c-10.557,0-19.125,8.568-19.125,19.125 v202.457l-78.814-78.814c-7.478-7.478-19.584-7.478-27.043,0c-7.478,7.478-7.478,19.584,0,27.042l108.19,108.19 c4.59,4.59,10.863,6.005,16.812,4.953c5.929,1.052,12.221-0.382,16.811-4.953l108.19-108.19c7.478-7.478,7.478-19.583,0-27.042 C423.523,288.29,411.417,288.29,403.939,295.749z M306,0C137.012,0,0,136.992,0,306s137.012,306,306,306s306-137.012,306-306 S475.008,0,306,0z M306,573.75C158.125,573.75,38.25,453.875,38.25,306C38.25,158.125,158.125,38.25,306,38.25 c147.875,0,267.75,119.875,267.75,267.75C573.75,453.875,453.875,573.75,306,573.75z\"\/> <\/g> <\/g> <\/g> <\/svg><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<p>\u0e42\u0e04\u0e49\u0e14\u0e19\u0e35\u0e49\u0e04\u0e37\u0e2d <strong>\u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e1e\u0e37\u0e49\u0e19\u0e10\u0e32\u0e19\u0e17\u0e35\u0e48\u0e2a\u0e38\u0e14\u0e02\u0e2d\u0e07\u0e18\u0e35\u0e21 Blogger<\/strong> \u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e14\u0e49\u0e27\u0e22:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e42\u0e04\u0e23\u0e07\u0e23\u0e48\u0e32\u0e07 HTML + namespace \u0e02\u0e2d\u0e07 Blogger<\/li>\n\n\n\n<li>meta \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d\/\u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b<\/li>\n\n\n\n<li>\u0e01\u0e32\u0e23\u0e14\u0e36\u0e07\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25 blog \u0e40\u0e0a\u0e48\u0e19\u0e0a\u0e37\u0e48\u0e2d\u0e40\u0e1e\u0e08<\/li>\n\n\n\n<li>\u0e1e\u0e37\u0e49\u0e19\u0e17\u0e35\u0e48\u0e43\u0e2b\u0e49\u0e43\u0e2a\u0e48 CSS<\/li>\n\n\n\n<li>\u0e2b\u0e19\u0e36\u0e48\u0e07 section \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e43\u0e2a\u0e48 widget<\/li>\n\n\n\n<li>\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e04\u0e23\u0e14\u0e34\u0e15\u0e14\u0e49\u0e32\u0e19\u0e25\u0e48\u0e32\u0e07<\/li>\n<\/ul>\n\n\n\n<p>\u0e40\u0e23\u0e35\u0e22\u0e1a\u0e07\u0e48\u0e32\u0e22\u0e41\u0e25\u0e30\u0e43\u0e0a\u0e49\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e40\u0e17\u0e21\u0e40\u0e1e\u0e25\u0e15 Blogger \u0e41\u0e1a\u0e1a minimal<\/p>\n\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e1b\u0e23\u0e30\u0e01\u0e32\u0e28 XML \u0e41\u0e25\u0e30\u0e01\u0e33\u0e2b\u0e19\u0e14 namespace<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-896bb7d640316dcef63d8a3d93536864\" style=\"border-width:10px\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml'\n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b'\n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data'\n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:0px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<ul class=\"wp-block-list\">\n<li><code>xmlns:b<\/code> = \u0e43\u0e0a\u0e49\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e41\u0e17\u0e47\u0e01 Blogger \u0e40\u0e0a\u0e48\u0e19 <code>&lt;b:if&gt;<\/code>, <code>&lt;b:section&gt;<\/code><\/li>\n\n\n\n<li><code>xmlns:data<\/code> = \u0e43\u0e0a\u0e49\u0e14\u0e36\u0e07\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e08\u0e32\u0e01 blog \u0e40\u0e0a\u0e48\u0e19 <code>data:blog.pageTitle<\/code><\/li>\n\n\n\n<li><code>xmlns:expr<\/code> = \u0e43\u0e0a\u0e49\u0e1b\u0e23\u0e30\u0e21\u0e27\u0e25\u0e1c\u0e25 expression \u0e15\u0e48\u0e32\u0e07\u0e46<\/li>\n<\/ul>\n\n<\/div>\n\t\t<\/div>\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e43\u0e2b\u0e49 Internet Explorer \u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25\u0e41\u0e1a\u0e1a IE7<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-58e73d99ba0223040fc26a0ee150d1fd\" style=\"border-width:10px\"><code>&lt;head&gt;\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt;\n<\/code><\/pre>\n\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e41\u0e22\u0e01\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a mobile \/ desktop<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-265861fa65ed032730cfdd18a78cf9a4\" style=\"border-width:10px\"><code>&lt;b:if cond='data:blog.isMobile'&gt;\n   &lt;meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'\/&gt;\n&lt;b:else\/&gt;\n   &lt;meta content='width=1100' name='viewport'\/&gt;\n&lt;\/b:if&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:0px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<ul class=\"wp-block-list\">\n<li>\u0e16\u0e49\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d \u2192 \u0e43\u0e0a\u0e49 viewport responsive<\/li>\n\n\n\n<li>\u0e16\u0e49\u0e32\u0e40\u0e1b\u0e47\u0e19 desktop \u2192 \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e40\u0e1b\u0e47\u0e19 1100px<\/li>\n<\/ul>\n\n<\/div>\n\t\t<\/div>\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e1a\u0e2d\u0e01 Blogger \u0e43\u0e2b\u0e49\u0e23\u0e27\u0e21\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32 <code>&lt;head&gt;<\/code> \u0e21\u0e32\u0e15\u0e23\u0e10\u0e32\u0e19\u0e02\u0e2d\u0e07 Blogger<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-1626414b83e3ad82f25977ad99919966\" style=\"border-width:10px\"><code>&lt;b:include data='blog' name='all-head-content'\/&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:0px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<ul class=\"wp-block-list\">\n<li>\u0e40\u0e0a\u0e48\u0e19 script \u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34, meta tag \u0e15\u0e48\u0e32\u0e07 \u0e46<\/li>\n<\/ul>\n\n<\/div>\n\t\t<\/div>\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e15\u0e31\u0e49\u0e07\u0e0a\u0e37\u0e48\u0e2d\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a \u0e08\u0e32\u0e01\u0e0a\u0e37\u0e48\u0e2d\u0e40\u0e1e\u0e08\u0e02\u0e2d\u0e07\u0e1a\u0e25\u0e47\u0e2d\u0e01<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-7df826d0983c5a9a5586f32e605a4cf2\" style=\"border-width:10px\"><code>&lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:0px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<ul class=\"wp-block-list\">\n<li>\u0e43\u0e0a\u0e49\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e17\u0e35\u0e48 Blogger \u0e2a\u0e23\u0e49\u0e32\u0e07\u0e43\u0e2b\u0e49\u0e42\u0e14\u0e22\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34<\/li>\n<\/ul>\n\n<\/div>\n\t\t<\/div>\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e2a\u0e48\u0e27\u0e19\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e43\u0e2a\u0e48 CSS \u0e02\u0e2d\u0e07\u0e18\u0e35\u0e21<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-97017c8c650be7e8ea032bb2cdf65ae9\" style=\"border-width:10px\"><code>&lt;b:skin&gt;\n   &lt;!&#91;CDATA&#91;\/* \n    ----- css Yours here -----\n   ]]>\n&lt;\/b:skin&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:0px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<ul class=\"wp-block-list\">\n<li><code>&lt;![CDATA[ ]]><\/code> = \u0e43\u0e0a\u0e49\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2a\u0e48\u0e42\u0e04\u0e49\u0e14\u0e17\u0e35\u0e48\u0e44\u0e21\u0e48\u0e43\u0e2b\u0e49 XML \u0e1b\u0e23\u0e30\u0e21\u0e27\u0e25\u0e1c\u0e25\u0e42\u0e14\u0e22\u0e15\u0e23\u0e07 \u0e40\u0e0a\u0e48\u0e19 CSS<\/li>\n<\/ul>\n\n<\/div>\n\t\t<\/div>\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e2a\u0e48\u0e27\u0e19\u0e41\u0e2a\u0e14\u0e07\u0e04\u0e2d\u0e19\u0e40\u0e17\u0e19\u0e15\u0e4c\u0e2b\u0e25\u0e31\u0e01\u0e02\u0e2d\u0e07 Blogger<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-3edd61112d07231939dee6541f6a011b\" style=\"border-width:10px\"><code>&lt;\/head&gt;\n&lt;body&gt;\n  &lt;b:section class='main' id='main' showaddelement='yes'\/&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:0px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<ul class=\"wp-block-list\">\n<li><code>&lt;b:section&gt;<\/code> \u0e04\u0e37\u0e2d\u0e2a\u0e48\u0e27\u0e19\u0e17\u0e35\u0e48\u0e40\u0e23\u0e32\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e40\u0e1e\u0e34\u0e48\u0e21 widget \u0e44\u0e14\u0e49<\/li>\n\n\n\n<li><code>showaddelement='yes'<\/code> = \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e40\u0e1e\u0e34\u0e48\u0e21 gadget \u0e43\u0e19 Layout \u0e44\u0e14\u0e49<\/li>\n<\/ul>\n\n<\/div>\n\t\t<\/div>\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading has-medium-font-size\">\u2714 \u0e1b\u0e34\u0e14\u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07 HTML<\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-1a147393a185193a94187e36a509e019\" style=\"border-width:10px\"><code>&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n<\/div>\n\t\t<\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-3357e758fe822ee229cd11c9cfa94c0d\" style=\"color:#206221\">2. \u0e18\u0e35\u0e21 Blogger (\u0e44\u0e21\u0e48\u0e21\u0e35\u0e41\u0e17\u0e1a\u0e14\u0e49\u0e32\u0e19\u0e02\u0e49\u0e32\u0e07)<\/h3>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-32cf059120b2dbf6ca10a9f8c3f6fc06\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml' \n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b' \n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data' \n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n\n&lt;head&gt;\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt; \n\n  &lt;b:if cond='data:blog.isMobile'&gt; \n    &lt;meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'\/&gt; \n  &lt;b:else\/&gt; \n    &lt;meta content='width=device-width, initial-scale=1.0' name='viewport'\/&gt; \n  &lt;\/b:if&gt; \n\n  &lt;b:include data='blog' name='all-head-content'\/&gt;\n  &lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n\n  &lt;link href='https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;600&amp;amp;display=swap' rel='stylesheet'\/&gt;\n\n  &lt;b:skin&gt;&lt;!&#91;CDATA&#91;\n    \/* Reset *\/\n    * {\n      margin: 0;\n      padding: 0;\n      box-sizing: border-box;\n    }\n\n    body {\n      font-family: 'Kanit', sans-serif;\n      background: #f7f9fc;\n      color: #333;\n      line-height: 1.6;\n    }\n\n    a {\n      color: inherit;\n      text-decoration: none;\n      transition: color 0.3s;\n    }\n    a:hover {\n      color: #008f7a;\n    }\n\n    header {\n      background: #ffffff;\n      box-shadow: 0 2px 8px rgba(0,0,0,0.05);\n      padding: 15px 30px;\n      position: sticky;\n      top: 0;\n      z-index: 100;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n    }\n\n    header h1 {\n      font-size: 1.5rem;\n      font-weight: 600;\n      color: #008f7a;\n    }\n\n    nav ul {\n      list-style: none;\n      display: flex;\n      gap: 20px;\n    }\n\n    nav li {\n      font-weight: 500;\n    }\n\n    .container {\n      max-width: 1100px;\n      margin: 30px auto;\n      padding: 0 15px;\n    }\n\n    \/* Blog Post Card *\/\n    .post-card {\n      background: #fff;\n      border-radius: 16px;\n      padding: 20px;\n      margin-bottom: 20px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n      transition: transform 0.3s;\n    }\n    .post-card:hover {\n      transform: translateY(-4px);\n    }\n\n    .post-card h2 {\n      font-size: 1.4rem;\n      margin-bottom: 10px;\n      color: #222;\n    }\n    .post-card p {\n      color: #666;\n      font-size: 1rem;\n    }\n\n    \/* Footer *\/\n    footer {\n      background: #222;\n      color: #eee;\n      text-align: center;\n      padding: 20px;\n      margin-top: 40px;\n    }\n\n  ]]>&lt;\/b:skin&gt;\n&lt;\/head&gt;\n\n<strong>&lt;body&gt;\n  &lt;!-- Header --&gt;\n  &lt;header&gt;\n    &lt;h1&gt;&lt;data:blog.title\/&gt;&lt;\/h1&gt;\n    &lt;nav&gt;\n      &lt;ul&gt;\n        &lt;li&gt;&lt;a expr:href='data:blog.homepageUrl'&gt;Home&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;About&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;Contact&lt;\/a&gt;&lt;\/li&gt;\n      &lt;\/ul&gt;\n    &lt;\/nav&gt;\n  &lt;\/header&gt;\n\n  &lt;!-- Content --&gt;\n  &lt;div class=\"container\"&gt;\n    &lt;b:section id='main' class='main' showaddelement='yes'&gt;\n      &lt;b:widget id='Blog1' type='Blog' title='Blog Posts' visible='true'\/&gt;\n    &lt;\/b:section&gt;\n  &lt;\/div&gt;\n\n  &lt;!-- Footer --&gt;\n  &lt;footer&gt;\n    &lt;p&gt;\u00a9 &lt;data:blog.title\/&gt; - Powered by Blogger&lt;\/p&gt;\n    &lt;p&gt;&lt;a href='\/\/siammakemoney.com' style='color:#00c9a7;'&gt;siammakemoney.com&lt;\/a&gt;&lt;\/p&gt;\n  &lt;\/footer&gt;\n\n&lt;\/body&gt;<\/strong>\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code has-primary-color has-text-color has-background has-link-color wp-elements-3d6595f17e9288adcb282088f30ccd14\" style=\"background-color:#f2e8d5\"><code>&lt;!-- Content --&gt;\n  &lt;div class=\"container\"&gt;\n    &lt;b:section id='main' class='main' showaddelement='yes'&gt;\n      &lt;b:widget id='Blog1' type='Blog' title='Blog Posts' visible='true'\/&gt;\n    &lt;\/b:section&gt;\n  &lt;\/div&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box info_type icon_type\" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><svg x=\"0px\" y=\"0px\" viewBox=\"0 0 512 512\"> <g><g> <path d=\"M256,0C114.497,0,0,114.507,0,256c0,141.503,114.507,256,256,256c141.503,0,256-114.507,256-256 C512,114.497,397.492,0,256,0z M256,472c-119.393,0-216-96.615-216-216c0-119.393,96.615-216,216-216 c119.393,0,216,96.615,216,216C472,375.393,375.384,472,256,472z\"\/> <\/g> <\/g> <g> <g> <path d=\"M256,214.33c-11.046,0-20,8.954-20,20v128.793c0,11.046,8.954,20,20,20s20-8.955,20-20.001V234.33 C276,223.284,267.046,214.33,256,214.33z\"\/> <\/g> <\/g> <g> <g> <circle cx=\"256\" cy=\"162.84\" r=\"27\"\/> <\/g> <\/g> <\/svg><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<p>&lt;!&#8211; Header &#8211;&gt; \u0e2a\u0e48\u0e27\u0e19\u0e2b\u0e31\u0e27\u0e40\u0e21\u0e19\u0e39<\/p>\n\n\n\n<p>&lt;!&#8211; Content &#8211;&gt; \u0e2a\u0e48\u0e27\u0e19\u0e19\u0e35\u0e49\u0e04\u0e37\u0e2d\u0e01\u0e32\u0e23\u0e14\u0e36\u0e07\u0e42\u0e1e\u0e2a\u0e21\u0e32\u0e41\u0e2a\u0e14\u0e07<\/p>\n\n\n\n<p>&lt;!&#8211; Footer &#8211;&gt; \u0e2a\u0e48\u0e27\u0e19\u0e17\u0e49\u0e32\u0e22<\/p>\n\n<\/div>\n\t\t<\/div>\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h3 class=\"wp-block-heading\">\ud83e\uddf1 <strong>\u0e2a\u0e48\u0e27\u0e19\u0e1a\u0e19\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c (Header)<\/strong><\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-secondary-background-color has-background\" style=\"border-width:10px\"><code>&lt;header&gt;\n  &lt;h1&gt;&lt;data:blog.title\/&gt;&lt;\/h1&gt;\n  &lt;nav&gt;\n    &lt;ul&gt;\n      &lt;li&gt;&lt;a expr:href='data:blog.homepageUrl'&gt;Home&lt;\/a&gt;&lt;\/li&gt;\n      &lt;li&gt;&lt;a href='#'&gt;About&lt;\/a&gt;&lt;\/li&gt;\n      &lt;li&gt;&lt;a href='#'&gt;Contact&lt;\/a&gt;&lt;\/li&gt;\n    &lt;\/ul&gt;\n  &lt;\/nav&gt;\n&lt;\/header&gt;\n<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">\ud83d\udcf0 <strong>\u0e2a\u0e48\u0e27\u0e19\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32 (Content Section)<\/strong><\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-secondary-background-color has-background\" style=\"border-width:10px\"><code>&lt;div class=\"container\"&gt;\n  &lt;b:section id='main' class='main' showaddelement='yes'&gt;\n    &lt;b:widget id='Blog1' type='Blog' title='Blog Posts' visible='true'\/&gt;\n  &lt;\/b:section&gt;\n&lt;\/div&gt;\n<\/code><\/pre>\n\n\n<div class=\"gc-box border_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<h4 class=\"wp-block-heading\"><strong>\u0e2a\u0e48\u0e27\u0e19\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32<\/strong> \u0e17\u0e33\u0e07\u0e32\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23?<\/h4>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>&lt;b:section&gt;<\/code> = \u0e1e\u0e37\u0e49\u0e19\u0e17\u0e35\u0e48\u0e43\u0e2a\u0e48 widget (\u0e08\u0e31\u0e14\u0e1c\u0e48\u0e32\u0e19 Layout \u0e43\u0e19 Blogger)<\/li>\n\n\n\n<li><code>&lt;b:widget type=\"Blog\"&gt;<\/code> = \u0e41\u0e2a\u0e14\u0e07\u0e42\u0e1e\u0e2a\u0e15\u0e4c\u0e02\u0e2d\u0e07 Blogger<\/li>\n\n\n\n<li>Blogger \u0e08\u0e30 generate HTML \u0e14\u0e49\u0e32\u0e19\u0e43\u0e19 \u0e40\u0e0a\u0e48\u0e19:\n<ul class=\"wp-block-list\">\n<li>\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e42\u0e1e\u0e2a\u0e15\u0e4c\u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e41\u0e23\u0e01<\/li>\n\n\n\n<li>\u0e15\u0e31\u0e27\u0e40\u0e15\u0e47\u0e21\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e43\u0e19\u0e2b\u0e19\u0e49\u0e32\u0e42\u0e1e\u0e2a\u0e15\u0e4c<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n<\/div>\n\t\t<\/div>\n\n\n<h3 class=\"wp-block-heading\">\ud83d\udcd8 <strong>\u0e2a\u0e48\u0e27\u0e19\u0e17\u0e49\u0e32\u0e22 (Footer)<\/strong><\/h3>\n\n\n\n<pre class=\"wp-block-code has-border-color has-orange-border-color has-secondary-background-color has-background\" style=\"border-width:10px\"><code>&lt;footer&gt;\n  &lt;p&gt;\u00a9 &lt;data:blog.title\/&gt; - Powered by Blogger&lt;\/p&gt;\n  &lt;p&gt;&lt;a href='\/\/siammakemoney.com'&gt;siammakemoney.com&lt;\/a&gt;&lt;\/p&gt;\n&lt;\/footer&gt;\n<\/code><\/pre>\n\n<\/div>\n\t\t<\/div>\n\n\n<h4 class=\"wp-block-heading\">2.1 \u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e43\u0e19 Blogger \u0e15\u0e48\u0e32\u0e07\u0e46<\/h4>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-primary-background-color has-text-color has-background has-link-color wp-elements-50d332db34635f45c2d683c8173c6c2b\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml'\n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b'\n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data'\n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n\n&lt;head&gt;\n  &lt;!-- meta, title, CSS\/JS --&gt;\n&lt;\/head&gt;\n\n&lt;body&gt;\n  &lt;!-- header --&gt;\n  &lt;!-- navigation --&gt;\n  &lt;!-- main content --&gt;\n  &lt;!-- sidebar --&gt;\n  &lt;!-- footer --&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-primary-background-color has-text-color has-background has-link-color wp-elements-e2848c9b1b479a02df85e173d7fac992\"><code>&lt;b:section class='header' id='header' maxwidgets='1' showaddelement='no'&gt;\n  &lt;b:widget id='Header1' locked='true' title='Header' type='Header'\/&gt;\n&lt;\/b:section&gt;\n\n&lt;b:section class='content' id='content' showaddelement='yes'&gt;\n  &lt;b:widget id='Blog1' type='Blog' title='Blog Posts'\/&gt;\n&lt;\/b:section&gt;\n\n&lt;b:section class='sidebar' id='sidebar' showaddelement='yes'&gt;\n  &lt;b:widget id='Profile1' type='Profile' title='About Me'\/&gt;\n&lt;\/b:section&gt;\n\n&lt;b:section class='footer' id='footer' showaddelement='yes'&gt;\n  &lt;b:widget id='Attribution1' type='Attribution' title=''\/&gt;\n&lt;\/b:section&gt;\n<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">2.2 \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e0a\u0e37\u0e48\u0e2d\u0e40\u0e23\u0e37\u0e48\u0e2d\u0e07 Blogger<\/h4>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-primary-background-color has-text-color has-background has-link-color wp-elements-b54ec142428e489ef7e05a1cc08fcb90\"><code>&lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-245daa0eb7dd3819b76943d96588d996\" style=\"color:#206221;font-size:29px\">3. \u0e18\u0e35\u0e21\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e41\u0e16\u0e1a\u0e14\u0e49\u0e32\u0e19\u0e02\u0e49\u0e32\u0e07 (Sidebar Gadgets\/Widgets)<\/h3>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-6c6fdb7bc509c1f7e573f5600561aef3\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml' \n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b' \n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data' \n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n\n&lt;head&gt;\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt; \n  &lt;b:if cond='data:blog.isMobile'&gt; \n    &lt;meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'\/&gt; \n  &lt;b:else\/&gt; \n    &lt;meta content='width=device-width, initial-scale=1.0' name='viewport'\/&gt; \n  &lt;\/b:if&gt; \n\n  &lt;b:include data='blog' name='all-head-content'\/&gt;\n  &lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n\n  &lt;link href='https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;600&amp;amp;display=swap' rel='stylesheet'\/&gt;\n\n  &lt;b:skin&gt;&lt;!&#91;CDATA&#91;\n    body {\n      font-family: 'Kanit', sans-serif;\n      background: #f7f9fc;\n      color: #333;\n      line-height: 1.6;\n      margin: 0;\n    }\n\n    a { text-decoration: none; color: inherit; }\n\n    header {\n      background: #fff;\n      padding: 15px 30px;\n      box-shadow: 0 2px 8px rgba(0,0,0,0.05);\n      position: sticky;\n      top: 0;\n      z-index: 100;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    header h1 { color: #008f7a; font-size: 1.5rem; }\n\n    nav ul { display: flex; gap: 20px; list-style: none; }\n    nav li { font-weight: 500; }\n\n    .container {\n      display: grid;\n      grid-template-columns: 2fr 1fr; \/* Main 2 \u0e2a\u0e48\u0e27\u0e19 \/ Sidebar 1 \u0e2a\u0e48\u0e27\u0e19 *\/\n      gap: 20px;\n      max-width: 1200px;\n      margin: 30px auto;\n      padding: 0 15px;\n    }\n\n    \/* Post card *\/\n    .post-card {\n      background: #fff;\n      border-radius: 12px;\n      padding: 20px;\n      margin-bottom: 20px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n      transition: transform 0.3s;\n    }\n    .post-card:hover { transform: translateY(-4px); }\n    .post-card h2 { font-size: 1.3rem; margin-bottom: 10px; }\n    .post-card p { color: #666; }\n\n    \/* Sidebar *\/\n    .sidebar {\n      background: #fff;\n      border-radius: 12px;\n      padding: 20px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n      height: fit-content;\n    }\n    .sidebar h3 { font-size: 1.2rem; margin-bottom: 15px; color: #008f7a; }\n\n    \/* Footer *\/\n    footer {\n      background: #222;\n      color: #eee;\n      text-align: center;\n      padding: 20px;\n      margin-top: 40px;\n    }\n\n  ]]>&lt;\/b:skin&gt;\n&lt;\/head&gt;\n\n&lt;body&gt;\n  &lt;!-- Header --&gt;\n  &lt;header&gt;\n    &lt;h1&gt;&lt;data:blog.title\/&gt;&lt;\/h1&gt;\n    &lt;nav&gt;\n      &lt;ul&gt;\n        &lt;li&gt;&lt;a expr:href='data:blog.homepageUrl'&gt;Home&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;About&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;Contact&lt;\/a&gt;&lt;\/li&gt;\n      &lt;\/ul&gt;\n    &lt;\/nav&gt;\n  &lt;\/header&gt;\n\n  &lt;!-- Content --&gt;\n  &lt;div class=\"container\"&gt;\n    &lt;!-- Main --&gt;\n    &lt;main&gt;\n      &lt;b:section id='main' class='main' showaddelement='yes'&gt;\n        &lt;b:widget id='Blog1' type='Blog' title='Blog Posts' visible='true'\/&gt;\n      &lt;\/b:section&gt;\n    &lt;\/main&gt;\n\n    <strong>&lt;!-- Sidebar --&gt;\n    &lt;aside class=\"sidebar\"&gt;\n      &lt;h3&gt;Gadgets&lt;\/h3&gt;\n      &lt;b:section id='sidebar' class='sidebar-widgets' showaddelement='yes'\/&gt;\n    &lt;\/aside&gt;\n  &lt;\/div&gt;<\/strong>\n\n  &lt;!-- Footer --&gt;\n  &lt;footer&gt;\n    &lt;p&gt;\u00a9 &lt;data:blog.title\/&gt; - Powered by Blogger&lt;\/p&gt;\n    &lt;p&gt;&lt;a href='\/\/siammakemoney.com' style='color:#00c9a7;'&gt;siammakemoney.com&lt;\/a&gt;&lt;\/p&gt;\n  &lt;\/footer&gt;\n\n  &lt;!-- Back to top --&gt;\n  &lt;button id=\"back-to-top\" class=\"back-to-top\"&gt;\u2191&lt;\/button&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n<div class=\"gc-box info_type icon_type\" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><svg x=\"0px\" y=\"0px\" viewBox=\"0 0 512 512\"> <g><g> <path d=\"M256,0C114.497,0,0,114.507,0,256c0,141.503,114.507,256,256,256c141.503,0,256-114.507,256-256 C512,114.497,397.492,0,256,0z M256,472c-119.393,0-216-96.615-216-216c0-119.393,96.615-216,216-216 c119.393,0,216,96.615,216,216C472,375.393,375.384,472,256,472z\"\/> <\/g> <\/g> <g> <g> <path d=\"M256,214.33c-11.046,0-20,8.954-20,20v128.793c0,11.046,8.954,20,20,20s20-8.955,20-20.001V234.33 C276,223.284,267.046,214.33,256,214.33z\"\/> <\/g> <\/g> <g> <g> <circle cx=\"256\" cy=\"162.84\" r=\"27\"\/> <\/g> <\/g> <\/svg><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<p><strong>\u0e41\u0e16\u0e1a\u0e14\u0e49\u0e32\u0e19\u0e02\u0e49\u0e32\u0e07 (Sidebar Gadgets\/Widgets)<\/strong> \u0e43\u0e19\u0e18\u0e35\u0e21 Blogger \u0e40\u0e23\u0e32\u0e15\u0e49\u0e2d\u0e07\u0e40\u0e1e\u0e34\u0e48\u0e21 <code>&lt;b:section&gt;<\/code> \u0e44\u0e27\u0e49\u0e43\u0e19 <code>&lt;body&gt;<\/code> \u0e02\u0e49\u0e32\u0e07 \u0e46 <code>main<\/code> (\u0e2a\u0e48\u0e27\u0e19\u0e41\u0e2a\u0e14\u0e07\u0e42\u0e1e\u0e2a\u0e15\u0e4c)<\/p>\n\n<\/div>\n\t\t<\/div>\n\n\n<h4 class=\"wp-block-heading\">\u2705 3.1. \u0e2a\u0e48\u0e27\u0e19\u0e1b\u0e23\u0e30\u0e01\u0e32\u0e28 XML \u0e41\u0e25\u0e30 Namespace<\/h4>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-922245705145cdd5813e3c5ded7e3ce0\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml' \n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b' \n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data' \n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22<\/h5>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>&lt;?xml ...?&gt;<\/code> \u2192 \u0e1a\u0e2d\u0e01\u0e27\u0e48\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e44\u0e1f\u0e25\u0e4c XML \u0e17\u0e35\u0e48 Blogger \u0e43\u0e0a\u0e49\u0e41\u0e1b\u0e25\u0e07\u0e40\u0e1b\u0e47\u0e19 HTML<\/li>\n\n\n\n<li><code>xmlns:b<\/code> \u2192 \u0e43\u0e0a\u0e49\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e41\u0e17\u0e47\u0e01\u0e02\u0e2d\u0e07 Blogger \u0e40\u0e0a\u0e48\u0e19 <code>&lt;b:section&gt;<\/code>, <code>&lt;b:widget&gt;<\/code><\/li>\n\n\n\n<li><code>xmlns:data<\/code> \u2192 \u0e43\u0e0a\u0e49\u0e14\u0e36\u0e07\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25 \u0e40\u0e0a\u0e48\u0e19 <code>&lt;data:blog.title\/&gt;<\/code><\/li>\n\n\n\n<li><code>xmlns:expr<\/code> \u2192 \u0e43\u0e0a\u0e49\u0e43\u0e2a\u0e48\u0e19\u0e34\u0e1e\u0e08\u0e19\u0e4c \u0e40\u0e0a\u0e48\u0e19 <code>expr:href='data:blog.url'<\/code><\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\u2705 3.2. <code>&lt;head&gt;<\/code> \u0e2a\u0e48\u0e27\u0e19\u0e2b\u0e31\u0e27\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c<\/h4>\n\n\n\n<h5 class=\"wp-block-heading\">3.2.1 \u0e23\u0e2d\u0e07\u0e23\u0e31\u0e1a Internet Explorer \u0e40\u0e01\u0e48\u0e32<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-f8ea26c6fc4657a443d91949b73c9f66\"><code>&lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt;\n<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">3.2.2 Viewport \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d \/ \u0e40\u0e14\u0e2a\u0e01\u0e4c\u0e17\u0e47\u0e2d\u0e1b<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-756cfa59a3f387b09f866cdb0c174faf\"><code>&lt;b:if cond='data:blog.isMobile'&gt;\n  &lt;meta content='width=device-width,initial-scale=1.0,...' name='viewport'\/&gt;\n&lt;b:else\/&gt;\n  &lt;meta content='width=device-width, initial-scale=1.0' name='viewport'\/&gt;\n&lt;\/b:if&gt;\n<\/code><\/pre>\n\n\n\n<p><strong>\u0e17\u0e33\u0e07\u0e32\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23?<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e16\u0e49\u0e32\u0e40\u0e02\u0e49\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e14\u0e49\u0e27\u0e22\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d \u2192 \u0e43\u0e0a\u0e49 viewport \u0e41\u0e1a\u0e1a mobile friendly<\/li>\n\n\n\n<li>\u0e16\u0e49\u0e32\u0e40\u0e1b\u0e47\u0e19 desktop \u2192 \u0e43\u0e0a\u0e49\u0e41\u0e1a\u0e1a\u0e40\u0e15\u0e47\u0e21\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d<\/li>\n<\/ul>\n\n\n\n<h5 class=\"wp-block-heading\">3.2.3 \u0e42\u0e2b\u0e25\u0e14\u0e2a\u0e48\u0e27\u0e19 head \u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e02\u0e2d\u0e07 Blogger<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-0bff4783996ec1a5ba1cc8b8eaca4706\"><code>&lt;b:include data='blog' name='all-head-content'\/&gt;\n<\/code><\/pre>\n\n\n\n<p>\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\u0e14\u0e49\u0e27\u0e22:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>meta \u0e02\u0e2d\u0e07\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21<\/li>\n\n\n\n<li>Open Graph<\/li>\n\n\n\n<li>Schema \u0e1e\u0e37\u0e49\u0e19\u0e10\u0e32\u0e19<\/li>\n\n\n\n<li>Feed<br><strong>\u0e2a\u0e33\u0e04\u0e31\u0e0d\u0e21\u0e32\u0e01 \u0e2b\u0e49\u0e32\u0e21\u0e25\u0e1a<\/strong><\/li>\n<\/ul>\n\n\n\n<h5 class=\"wp-block-heading\">3.2.4 \u0e14\u0e36\u0e07\u0e0a\u0e37\u0e48\u0e2d\u0e2b\u0e19\u0e49\u0e32\u0e40\u0e1b\u0e47\u0e19 <code>&lt;title&gt;<\/code><\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-37701c68195ff66f18d6c837276cdc0c\"><code>&lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">3.2.5 \u0e42\u0e2b\u0e25\u0e14 Google Fonts<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-847fd7abb34d9744800d215329ca8699\"><code>&lt;link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kanit...\" \/&gt;\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83c\udfa83.3 CSS \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14 (\u0e20\u0e32\u0e22\u0e43\u0e19 <code>&lt;b:skin&gt;<\/code>)<\/h4>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-c702187c8b432c1d7447c3812db0ee06\"><code>&lt;b:skin&gt;&lt;!&#91;CDATA&#91;\n  ... CSS ...\n]]>&lt;\/b:skin&gt;\n<\/code><\/pre>\n\n\n\n<p>Blogger \u0e15\u0e49\u0e2d\u0e07\u0e43\u0e2a\u0e48 CSS \u0e20\u0e32\u0e22\u0e43\u0e19 <code>&lt;b:skin&gt;<\/code> \u0e40\u0e17\u0e48\u0e32\u0e19\u0e31\u0e49\u0e19<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83e\uddf1 4. \u0e2a\u0e48\u0e27\u0e19 Header \u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c<\/h4>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-c999c24df9ac3cbb6bf181c197ea883b\"><code>&lt;header&gt;\n  &lt;h1&gt;&lt;data:blog.title\/&gt;&lt;\/h1&gt;\n  &lt;nav&gt;\n    &lt;ul&gt;\n      &lt;li&gt;&lt;a expr:href='data:blog.homepageUrl'&gt;Home&lt;\/a&gt;&lt;\/li&gt;\n      &lt;li&gt;&lt;a href='#'&gt;About&lt;\/a&gt;&lt;\/li&gt;\n      &lt;li&gt;&lt;a href='#'&gt;Contact&lt;\/a&gt;&lt;\/li&gt;\n    &lt;\/ul&gt;\n  &lt;\/nav&gt;\n&lt;\/header&gt;\n<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22<\/h5>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>&lt;data:blog.title\/&gt;<\/code> \u2192 \u0e0a\u0e37\u0e48\u0e2d\u0e1a\u0e25\u0e47\u0e2d\u0e01<\/li>\n\n\n\n<li>\u0e40\u0e21\u0e19\u0e39\u0e40\u0e23\u0e35\u0e22\u0e07\u0e08\u0e32\u0e01\u0e0b\u0e49\u0e32\u0e22\u0e44\u0e1b\u0e02\u0e27\u0e32<\/li>\n\n\n\n<li>Header Sticky \u0e15\u0e32\u0e21 CSS<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83d\udcf0 5. Layout \u0e1a\u0e23\u0e34\u0e40\u0e27\u0e13\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32 (Content Container)<\/h4>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-572587a0695316628bdde2a0692be028\"><code>&lt;div class=\"container\"&gt;\n  &lt;main&gt;\n    &lt;b:section id='main'&gt;\n      &lt;b:widget type='Blog'\/&gt;\n    &lt;\/b:section&gt;\n  &lt;\/main&gt;\n\n  &lt;aside class=\"sidebar\"&gt;\n    &lt;h3&gt;Gadgets&lt;\/h3&gt;\n    &lt;b:section id='sidebar'\/&gt;\n  &lt;\/aside&gt;\n&lt;\/div&gt;\n<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">5.1 Main Content<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-69bab345533ccf0cae1cebf771d0b715\"><code>&lt;b:widget type='Blog' \/&gt;\n<\/code><\/pre>\n\n\n\n<p><strong>\u0e40\u0e1b\u0e47\u0e19\u0e2b\u0e31\u0e27\u0e43\u0e08\u0e02\u0e2d\u0e07 Blogger<\/strong><br>\u0e41\u0e2a\u0e14\u0e07:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e42\u0e1e\u0e2a\u0e15\u0e4c<\/li>\n\n\n\n<li>\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e40\u0e15\u0e47\u0e21<\/li>\n\n\n\n<li>pagination<\/li>\n<\/ul>\n\n\n\n<h5 class=\"wp-block-heading\">5.2 Sidebar<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-1dab3c3709151e563ecb35aad6080123\"><code>&lt;b:section id='sidebar' ... \/&gt;\n<\/code><\/pre>\n\n\n\n<p>\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e40\u0e1e\u0e34\u0e48\u0e21 widget \u0e08\u0e32\u0e01 Layout \u0e40\u0e0a\u0e48\u0e19:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Popular Posts<\/li>\n\n\n\n<li>HTML\/JavaScript<\/li>\n\n\n\n<li>Labels<\/li>\n\n\n\n<li>Ads<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83e\udde9 6. Footer<\/h4>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-be13776c7c1c685e4bc6ced575cfdc1d\"><code>&lt;footer&gt;\n  &lt;p&gt;\u00a9 &lt;data:blog.title\/&gt; - Powered by Blogger&lt;\/p&gt;\n  &lt;p&gt;&lt;a href=\"\/\/siammakemoney.com\"&gt;...&lt;\/a&gt;&lt;\/p&gt;\n&lt;\/footer&gt;\n<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">\u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22<\/h5>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e14\u0e36\u0e07\u0e1b\u0e35\u0e41\u0e25\u0e30\u0e0a\u0e37\u0e48\u0e2d\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34<\/li>\n\n\n\n<li>\u0e43\u0e2a\u0e48\u0e40\u0e04\u0e23\u0e14\u0e34\u0e15<\/li>\n\n\n\n<li>\u0e2a\u0e35\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07\u0e40\u0e1b\u0e47\u0e19\u0e14\u0e33<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\u2b06\ufe0f 7. Back-to-Top Button<\/h4>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-807bab45c1cb270487277114c5716a7c\"><code>&lt;button id=\"back-to-top\" class=\"back-to-top\"&gt;\u2191&lt;\/button&gt;\n<\/code><\/pre>\n\n\n\n<p>\u0e1b\u0e01\u0e15\u0e34\u0e08\u0e30\u0e15\u0e49\u0e2d\u0e07\u0e21\u0e35 JS \u0e14\u0e49\u0e27\u0e22 \u0e40\u0e0a\u0e48\u0e19:<\/p>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-473b7fd97b155ad83e56d7520e14090b\"><code>\nwindow.addEventListener('scroll', () =&gt; {\n  document.getElementById('back-to-top').style.display =\n    window.scrollY &gt; 300 ? 'block' : 'none';\n});\n\n\ndocument.getElementById('back-to-top').onclick = () =&gt;\n  window.scrollTo({ top: 0, behavior: 'smooth' });<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>\u0e2a\u0e48\u0e27\u0e19<\/th><th>\u0e17\u0e33\u0e2d\u0e30\u0e44\u0e23<\/th><\/tr><\/thead><tbody><tr><td>XML Namespace<\/td><td>\u0e17\u0e33\u0e43\u0e2b\u0e49\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e41\u0e17\u0e47\u0e01 Blogger \u0e44\u0e14\u0e49<\/td><\/tr><tr><td>Viewport<\/td><td>Responsive<\/td><\/tr><tr><td>all-head-content<\/td><td>SEO + Meta auto \u0e08\u0e32\u0e01 Blogger<\/td><\/tr><tr><td>CSS<\/td><td>\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a Layout \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14<\/td><\/tr><tr><td>Header<\/td><td>\u0e42\u0e25\u0e42\u0e01\u0e49 + \u0e40\u0e21\u0e19\u0e39<\/td><\/tr><tr><td>Container<\/td><td>Grid 2 \u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c<\/td><\/tr><tr><td>Blog1<\/td><td>\u0e41\u0e2a\u0e14\u0e07\u0e42\u0e1e\u0e2a\u0e15\u0e4c\u0e02\u0e2d\u0e07\u0e1a\u0e25\u0e47\u0e2d\u0e01<\/td><\/tr><tr><td>Sidebar<\/td><td>\u0e27\u0e32\u0e07 widget \u0e44\u0e14\u0e49\u0e15\u0e32\u0e21\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23<\/td><\/tr><tr><td>Footer<\/td><td>\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e25\u0e34\u0e02\u0e2a\u0e34\u0e17\u0e18\u0e34\u0e4c<\/td><\/tr><tr><td>Back-to-Top<\/td><td>\u0e1b\u0e38\u0e48\u0e21\u0e01\u0e25\u0e31\u0e1a\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-d5b3c96cf873e0a8ca87f15918522ba2\" style=\"color:#206221\">4. \u0e42\u0e04\u0e49\u0e14\u0e18\u0e35\u0e21 Blogger Sidebar \u0e0b\u0e49\u0e32\u0e22 + \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e21\u0e19\u0e39\u0e44\u0e14\u0e49<\/h3>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-227c88552866b011f2414cf63e980204\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml' \n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b' \n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data' \n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n\n&lt;head&gt;\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt; \n  &lt;b:if cond='data:blog.isMobile'&gt; \n    &lt;meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'\/&gt; \n  &lt;b:else\/&gt; \n    &lt;meta content='width=device-width, initial-scale=1.0' name='viewport'\/&gt; \n  &lt;\/b:if&gt; \n\n  &lt;b:include data='blog' name='all-head-content'\/&gt;\n  &lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n\n  &lt;link href='https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;600&amp;amp;display=swap' rel='stylesheet'\/&gt;\n\n  &lt;b:skin&gt;&lt;!&#91;CDATA&#91;\n    body {\n      font-family: 'Kanit', sans-serif;\n      background: #f7f9fc;\n      color: #333;\n      line-height: 1.6;\n      margin: 0;\n    }\n\n    a { text-decoration: none; color: inherit; }\n    a:hover { color: #008f7a; }\n\n    header {\n      background: #fff;\n      padding: 15px 30px;\n      box-shadow: 0 2px 8px rgba(0,0,0,0.05);\n      position: sticky;\n      top: 0;\n      z-index: 100;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    header h1 { color: #008f7a; font-size: 1.5rem; }\n    nav ul { display: flex; gap: 20px; list-style: none; }\n    nav li { font-weight: 500; }\n\n    .container {\n      display: grid;\n      grid-template-columns: 300px 1fr; \/* Sidebar 300px \/ Main content flexible *\/\n      gap: 20px;\n      max-width: 1200px;\n      margin: 30px auto;\n      padding: 0 15px;\n    }\n\n    \/* Post card *\/\n    .post-card {\n      background: #fff;\n      border-radius: 12px;\n      padding: 20px;\n      margin-bottom: 20px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n      transition: transform 0.3s;\n    }\n    .post-card:hover { transform: translateY(-4px); }\n    .post-card h2 { font-size: 1.3rem; margin-bottom: 10px; }\n    .post-card p { color: #666; }\n\n    \/* Sidebar *\/\n    .sidebar {\n      background: #fff;\n      border-radius: 12px;\n      padding: 20px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n      height: fit-content;\n    }\n    .sidebar h3 { font-size: 1.2rem; margin-bottom: 15px; color: #008f7a; }\n\n    \/* Footer *\/\n    footer {\n      background: #222;\n      color: #eee;\n      text-align: center;\n      padding: 20px;\n      margin-top: 40px;\n    }\n\n    \/* Back to top *\/\n    .back-to-top {\n      position: fixed;\n      bottom: 20px;\n      right: 20px;\n      background: #008f7a;\n      color: #fff;\n      border: none;\n      border-radius: 50%;\n      width: 50px;\n      height: 50px;\n      font-size: 20px;\n      cursor: pointer;\n      display: none;\n      align-items: center;\n      justify-content: center;\n      box-shadow: 0 4px 8px rgba(0,0,0,0.15);\n    }\n    .back-to-top:hover {\n      background: #006f5a;\n    }\n\n    \/* Responsive *\/\n    @media screen and (max-width: 900px) {\n      .container {\n        grid-template-columns: 1fr;\n      }\n      .sidebar { margin-bottom: 20px; }\n    }\n  ]]>&lt;\/b:skin&gt;\n&lt;\/head&gt;\n\n&lt;body&gt;\n  <strong>&lt;!-- Header --&gt;\n  &lt;header&gt;\n    &lt;h1&gt;&lt;data:blog.title\/&gt;&lt;\/h1&gt;\n    &lt;nav&gt;\n      &lt;ul&gt;\n        &lt;li&gt;&lt;a expr:href='data:blog.homepageUrl'&gt;Home&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;About&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;Contact&lt;\/a&gt;&lt;\/li&gt;\n      &lt;\/ul&gt;\n    &lt;\/nav&gt;\n  &lt;\/header&gt;\n\n  &lt;!-- Container: Sidebar + Main --&gt;\n  &lt;div class=\"container\"&gt;\n    &lt;!-- Sidebar --&gt;\n    &lt;aside class=\"sidebar\"&gt;\n      &lt;h3&gt;Menu &amp;amp; Gadgets&lt;\/h3&gt;\n      &lt;b:section id='sidebar' class='sidebar-widgets' showaddelement='yes'\/&gt;\n    &lt;\/aside&gt;\n\n    &lt;!-- Main content --&gt;\n    &lt;main&gt;\n      &lt;b:section id='main' class='main' showaddelement='yes'&gt;\n        &lt;b:widget id='Blog1' type='Blog' title='Blog Posts' visible='true'\/&gt;\n      &lt;\/b:section&gt;\n    &lt;\/main&gt;\n  &lt;\/div&gt;\n\n  &lt;!-- Footer --&gt;\n  &lt;footer&gt;\n    &lt;p&gt;\u00a9 &lt;data:blog.title\/&gt; - Powered by Blogger&lt;\/p&gt;\n    &lt;p&gt;&lt;a href='\/\/siammakemoney.com' style='color:#00c9a7;'&gt;siammakemoney.com&lt;\/a&gt;&lt;\/p&gt;\n  &lt;\/footer&gt;<\/strong>\n\n  &lt;!-- Back to top --&gt;\n  &lt;button id=\"back-to-top\" class=\"back-to-top\"&gt;\u2191&lt;\/button&gt;\n\n  &lt;script&gt;\n    const btn = document.getElementById('back-to-top');\n    window.addEventListener('scroll', () =&gt; {\n      btn.style.display = window.scrollY &gt; 200 ? 'flex' : 'none';\n    });\n    btn.addEventListener('click', () =&gt; {\n      window.scrollTo({ top: 0, behavior: 'smooth' });\n    });\n  &lt;\/script&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n<div class=\"gc-box info_type icon_type\" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><svg x=\"0px\" y=\"0px\" viewBox=\"0 0 512 512\"> <g><g> <path d=\"M256,0C114.497,0,0,114.507,0,256c0,141.503,114.507,256,256,256c141.503,0,256-114.507,256-256 C512,114.497,397.492,0,256,0z M256,472c-119.393,0-216-96.615-216-216c0-119.393,96.615-216,216-216 c119.393,0,216,96.615,216,216C472,375.393,375.384,472,256,472z\"\/> <\/g> <\/g> <g> <g> <path d=\"M256,214.33c-11.046,0-20,8.954-20,20v128.793c0,11.046,8.954,20,20,20s20-8.955,20-20.001V234.33 C276,223.284,267.046,214.33,256,214.33z\"\/> <\/g> <\/g> <g> <g> <circle cx=\"256\" cy=\"162.84\" r=\"27\"\/> <\/g> <\/g> <\/svg><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<p>&lt;!&#8211; Sidebar (\u0e0b\u0e49\u0e32\u0e22) &#8211;&gt;<\/p>\n\n\n\n<p>&lt;!&#8211; Main content (\u0e02\u0e27\u0e32) &#8211;&gt;<\/p>\n\n<\/div>\n\t\t<\/div>\n\n\n<h4 class=\"wp-block-heading\">\ud83d\udd37 \u0e20\u0e32\u0e1e\u0e23\u0e27\u0e21\u0e02\u0e2d\u0e07\u0e42\u0e04\u0e49\u0e14\u0e43\u0e19\u0e18\u0e35\u0e21\u0e19\u0e35\u0e49<\/h4>\n\n\n\n<p>\u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d <strong>Template Blogger \u0e41\u0e1a\u0e1a 2 \u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c (Sidebar + Main)<\/strong> \u0e17\u0e35\u0e48\u0e21\u0e35:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Header sticky<\/li>\n\n\n\n<li>Sidebar fixed width (300px)<\/li>\n\n\n\n<li>Main content flexible<\/li>\n\n\n\n<li>Post card design<\/li>\n\n\n\n<li>Footer<\/li>\n\n\n\n<li>Back-to-top button<\/li>\n\n\n\n<li>Responsive layout<\/li>\n\n\n\n<li>\u0e14\u0e36\u0e07\u0e42\u0e1e\u0e2a\u0e15\u0e4c\u0e1c\u0e48\u0e32\u0e19 <code>&lt;b:widget type=\"Blog\"&gt;<\/code><\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83d\udd36 4.1. \u0e2a\u0e48\u0e27\u0e19\u0e1b\u0e23\u0e30\u0e01\u0e32\u0e28 XML \u0e41\u0e25\u0e30 Namespace<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml'\n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b'\n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data'\n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">\u2714 \u0e2d\u0e18\u0e34\u0e1a\u0e32\u0e22<\/h4>\n\n\n\n<p>\u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d <strong>\u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2b\u0e25\u0e31\u0e01\u0e17\u0e35\u0e48 Blogger \u0e15\u0e49\u0e2d\u0e07\u0e43\u0e0a\u0e49<\/strong>:<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>namespace<\/th><th>\u0e2b\u0e19\u0e49\u0e32\u0e17\u0e35\u0e48<\/th><\/tr><\/thead><tbody><tr><td><code>b:<\/code><\/td><td>\u0e43\u0e0a\u0e49\u0e41\u0e17\u0e47\u0e01\u0e23\u0e30\u0e1a\u0e1a\u0e02\u0e2d\u0e07 Blogger \u0e40\u0e0a\u0e48\u0e19 <code>&lt;b:section&gt;<\/code>, <code>&lt;b:widget&gt;<\/code><\/td><\/tr><tr><td><code>data:<\/code><\/td><td>\u0e14\u0e36\u0e07\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25 \u0e40\u0e0a\u0e48\u0e19 <code>&lt;data:blog.title\/&gt;<\/code><\/td><\/tr><tr><td><code>expr:<\/code><\/td><td>\u0e01\u0e32\u0e23\u0e40\u0e02\u0e35\u0e22\u0e19 expression \u0e40\u0e0a\u0e48\u0e19 <code>expr:href=\"data:blog.homepageUrl\"<\/code><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83d\udd36 4.2. <code>&lt;head&gt;<\/code> \u2014 \u0e2a\u0e48\u0e27\u0e19\u0e2b\u0e31\u0e27\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a<\/h4>\n\n\n\n<h5 class=\"wp-block-heading\">\u27144.2.1 Viewport \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-9c34ec718453162304a05f45e6d9c456\"><code>&lt;b:if cond='data:blog.isMobile'&gt;\n  &lt;meta content=\"width=device-width, initial-scale=1.0\" \/&gt;\n&lt;b:else\/&gt;\n  &lt;meta content=\"width=device-width, initial-scale=1.0\" \/&gt;\n&lt;\/b:if&gt;\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.2.2 \u0e43\u0e2a\u0e48 meta \u0e41\u0e25\u0e30 script \u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34\u0e02\u0e2d\u0e07 Blogger<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-0bff4783996ec1a5ba1cc8b8eaca4706\"><code>&lt;b:include data='blog' name='all-head-content'\/&gt;\n<\/code><\/pre>\n\n\n\n<p>Blogger \u0e08\u0e30\u0e43\u0e2a\u0e48\u0e2a\u0e34\u0e48\u0e07\u0e15\u0e48\u0e2d\u0e44\u0e1b\u0e19\u0e35\u0e49\u0e43\u0e2b\u0e49\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Title \/ Description \u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32<\/li>\n\n\n\n<li>OpenGraph<\/li>\n\n\n\n<li>Schema \u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21<\/li>\n\n\n\n<li>Canonical URL<\/li>\n\n\n\n<li>Feed<\/li>\n\n\n\n<li>CSS widget<\/li>\n<\/ul>\n\n\n\n<p><strong>\u0e40\u0e1b\u0e47\u0e19\u0e2a\u0e48\u0e27\u0e19\u0e2a\u0e33\u0e04\u0e31\u0e0d \u0e2b\u0e49\u0e32\u0e21\u0e25\u0e1a<\/strong><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.2.3 Title \u0e02\u0e2d\u0e07\u0e2b\u0e19\u0e49\u0e32<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-df0058297cfed394f5afbe79e4dc39fa\"><code>&lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;<\/code><\/pre>\n\n\n\n<p>\u0e14\u0e36\u0e07\u0e0a\u0e37\u0e48\u0e2d\u0e15\u0e32\u0e21\u0e2b\u0e19\u0e49\u0e32 \u0e40\u0e0a\u0e48\u0e19:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e2b\u0e19\u0e49\u0e32\u0e41\u0e23\u0e01 \u2192 \u0e0a\u0e37\u0e48\u0e2d\u0e1a\u0e25\u0e47\u0e2d\u0e01<\/li>\n\n\n\n<li>\u0e2b\u0e19\u0e49\u0e32\u0e17\u0e35\u0e48\u0e41\u0e2a\u0e14\u0e07\u0e42\u0e1e\u0e2a\u0e15\u0e4c \u2192 \u0e0a\u0e37\u0e48\u0e2d\u0e42\u0e1e\u0e2a\u0e15\u0e4c<\/li>\n\n\n\n<li>\u0e2b\u0e19\u0e49\u0e32\u0e17\u0e35\u0e48\u0e21\u0e35 label \u2192 \u0e0a\u0e37\u0e48\u0e2d label<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.2.4 \u0e42\u0e2b\u0e25\u0e14\u0e1f\u0e2d\u0e19\u0e15\u0e4c Google<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-00dfba08d0dfa65da115e3cb6bd3b16c\"><code>&lt;link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kanit...\" \/&gt;<\/code><\/pre>\n\n\n\n<p>\u0e15\u0e31\u0e49\u0e07\u0e04\u0e48\u0e32\u0e1f\u0e2d\u0e19\u0e15\u0e4c\u0e17\u0e31\u0e48\u0e27\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83d\udd36 4.3. <code>&lt;b:skin&gt;<\/code> \u2014 \u0e2a\u0e48\u0e27\u0e19 CSS \u0e02\u0e2d\u0e07\u0e40\u0e17\u0e21\u0e40\u0e1e\u0e25\u0e15<\/h4>\n\n\n\n<p>Blogger \u0e15\u0e49\u0e2d\u0e07\u0e43\u0e2a\u0e48 CSS \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\u0e20\u0e32\u0e22\u0e43\u0e19 <code>&lt;b:skin&gt;&lt;![CDATA[ ... ]]>&lt;\/b:skin&gt;<\/code><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.1 \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e2a\u0e44\u0e15\u0e25\u0e4c\u0e2b\u0e25\u0e31\u0e01\u0e02\u0e2d\u0e07\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-638e5dd6105ad8cfc1b343985f288a62\"><code>body {\n  font-family:'Kanit';\n  background:#f7f9fc;\n  color:#333;\n}<\/code><\/pre>\n\n\n\n<p>\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e2a\u0e35\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07, \u0e1f\u0e2d\u0e19\u0e15\u0e4c, \u0e2a\u0e35\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.2 Header Sticky<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-c76ace725324a20d621f4c7e6e77e75a\"><code>header {\n  position:sticky;\n  top:0;\n  background:#fff;\n  box-shadow:0 2px 8px rgba(0,0,0,0.05);\n}\n<\/code><\/pre>\n\n\n\n<p>\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e40\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e2b\u0e19\u0e49\u0e32 \u2192 Header \u0e15\u0e34\u0e14\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.3 Navigation Menu<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-ddd9277cb112855dc5a51c857657dd0a\"><code>nav ul {\n  display:flex;\n  gap:20px;\n  list-style:none;\n}\n<\/code><\/pre>\n\n\n\n<p>\u0e40\u0e21\u0e19\u0e39\u0e40\u0e23\u0e35\u0e22\u0e07\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e19\u0e27\u0e19\u0e2d\u0e19\u0e14\u0e49\u0e27\u0e22 Flexbox<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.4 \u0e42\u0e04\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07 Layout \u0e41\u0e1a\u0e1a 2 \u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-37e2ef220d464b2c6773504a7db5aad3\"><code>.container {\n  display:grid;\n  grid-template-columns: 300px 1fr;\n  gap:20px;\n}\n<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>\u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c<\/th><th>\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07<\/th><\/tr><\/thead><tbody><tr><td>Sidebar<\/td><td>300px \u0e41\u0e1a\u0e1a\u0e15\u0e32\u0e22\u0e15\u0e31\u0e27<\/td><\/tr><tr><td>Main content<\/td><td>1fr (\u0e22\u0e37\u0e14\u0e44\u0e14\u0e49\u0e40\u0e15\u0e47\u0e21\u0e17\u0e35\u0e48)<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.5 Post Card (\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21)<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-5957b1a68904f976d7f28d8176d48cd6\"><code>.post-card {\n  background:#fff;\n  border-radius:12px;\n  padding:20px;\n  box-shadow:0 4px 12px rgba(0,0,0,0.05);\n}\n<\/code><\/pre>\n\n\n\n<p>\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e01\u0e32\u0e23\u0e4c\u0e14\u0e42\u0e1e\u0e2a\u0e15\u0e4c\u0e41\u0e1a\u0e1a\u0e2a\u0e27\u0e22\u0e07\u0e32\u0e21<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.6 Sidebar Box<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-39291f98679cae0958ba9950f307b416\"><code>.sidebar {\n  background:#fff;\n  border-radius:12px;\n  padding:20px;\n}\n<\/code><\/pre>\n\n\n\n<p>\u0e0a\u0e48\u0e2d\u0e07 Sidebar \u0e21\u0e35\u0e2a\u0e44\u0e15\u0e25\u0e4c\u0e40\u0e2b\u0e21\u0e37\u0e2d\u0e19\u0e01\u0e32\u0e23\u0e4c\u0e14<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.7 Footer<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-49e444bd1cc39617b37bbc5a98b83e72\"><code>footer {\n  background:#222;\n  color:#eee;\n  text-align:center;\n}\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 4.3.8 \u0e1b\u0e38\u0e48\u0e21 Back-to-top<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-395737c529d6325503a9830b458059de\"><code>.back-to-top {\n  position:fixed;\n  bottom:20px;\n  right:20px;\n  background:#008f7a;\n  width:50px;\n  height:50px;\n  border-radius:50%;\n  display:none;\n}\n<\/code><\/pre>\n\n\n\n<p>\u0e0b\u0e48\u0e2d\u0e19\u0e1b\u0e38\u0e48\u0e21\u0e44\u0e27\u0e49\u0e01\u0e48\u0e2d\u0e19<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u27144.3.9 Responsive Mobile<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-99152723f99407be298216b199dfda75\"><code>@media (max-width:900px) {\n  .container {\n    grid-template-columns:1fr;\n  }\n}\n<\/code><\/pre>\n\n\n\n<p>\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d \u2192 \u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e40\u0e1b\u0e47\u0e19 1 \u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\ud83d\udd36 4.4 \u0e2a\u0e48\u0e27\u0e19 <code>&lt;body&gt;<\/code><\/h4>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 Header<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-09ed10a3bbfa1e07817110cd9b6bf9bb\"><code>&lt;header&gt;\n  &lt;h1&gt;&lt;data:blog.title\/&gt;&lt;\/h1&gt;\n  &lt;nav&gt;\n    &lt;ul&gt;\n      &lt;li&gt;&lt;a expr:href='data:blog.homepageUrl'&gt;Home&lt;\/a&gt;&lt;\/li&gt;\n<\/code><\/pre>\n\n\n\n<p>\u0e14\u0e36\u0e07\u0e0a\u0e37\u0e48\u0e2d\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e21\u0e32\u0e41\u0e2a\u0e14\u0e07<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 Layout: Sidebar + Main<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-eac16f39d1b3c025a18533b8a8b96dbc\"><code>&lt;div class=\"container\"&gt;\n<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">\ud83d\udccc Sidebar<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-55330b1c517bae7c9baee4ca70d1224d\"><code>&lt;aside class=\"sidebar\"&gt;\n  &lt;b:section id='sidebar'\/&gt;\n&lt;\/aside&gt;\n<\/code><\/pre>\n\n\n\n<p>\u0e40\u0e1b\u0e47\u0e19 <strong>\u0e1e\u0e37\u0e49\u0e19\u0e17\u0e35\u0e48\u0e27\u0e32\u0e07 widget<\/strong> \u0e40\u0e0a\u0e48\u0e19:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Popular post<\/li>\n\n\n\n<li>Label<\/li>\n\n\n\n<li>HTML\/JS<\/li>\n\n\n\n<li>Profile<\/li>\n<\/ul>\n\n\n\n<p>\u0e1c\u0e39\u0e49\u0e43\u0e0a\u0e49\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e1c\u0e48\u0e32\u0e19\u0e2b\u0e19\u0e49\u0e32 Layout \u0e02\u0e2d\u0e07 Blogger<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\ud83d\udccc Main Content<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-f998ffdbc99c58915603cb6957a320cf\"><code>&lt;main&gt;\n  &lt;b:section id='main'&gt;\n    &lt;b:widget type='Blog'\/&gt;\n  &lt;\/b:section&gt;\n&lt;\/main&gt;\n<\/code><\/pre>\n\n\n\n<p><strong>\u0e19\u0e35\u0e48\u0e04\u0e37\u0e2d\u0e2b\u0e31\u0e27\u0e43\u0e08\u0e02\u0e2d\u0e07\u0e40\u0e17\u0e21\u0e40\u0e1e\u0e25\u0e15<\/strong><br>\u0e41\u0e2a\u0e14\u0e07\u0e1c\u0e25:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e42\u0e1e\u0e2a\u0e15\u0e4c<\/li>\n\n\n\n<li>\u0e1a\u0e17\u0e04\u0e27\u0e32\u0e21\u0e40\u0e15\u0e47\u0e21<\/li>\n\n\n\n<li>\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e<\/li>\n\n\n\n<li>Pagination<\/li>\n\n\n\n<li>Comment form<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 Footer<\/h5>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-89df06ba6b1836c807ff740f4246dbf3\"><code>&lt;footer&gt;\n  \u00a9 &lt;data:blog.title\/&gt;\n&lt;\/footer&gt;\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h5 class=\"wp-block-heading\">\u2714 Back-to-top Button + Script<\/h5>\n\n\n\n<h6 class=\"wp-block-heading\">\u0e1b\u0e38\u0e48\u0e21<\/h6>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-807bab45c1cb270487277114c5716a7c\"><code>&lt;button id=\"back-to-top\" class=\"back-to-top\"&gt;\u2191&lt;\/button&gt;\n<\/code><\/pre>\n\n\n\n<h6 class=\"wp-block-heading\">Script \u0e01\u0e32\u0e23\u0e17\u0e33\u0e07\u0e32\u0e19<\/h6>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-2de56eb1731c27fc9caa126c092538af\"><code>window.addEventListener('scroll', () =&gt; {\n  btn.style.display = window.scrollY &gt; 200 ? 'flex' : 'none';\n});\n<\/code><\/pre>\n\n\n\n<p>\u0e40\u0e07\u0e37\u0e48\u0e2d\u0e19\u0e44\u0e02: \u0e40\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e25\u0e07 &gt; 200px \u2192 \u0e41\u0e2a\u0e14\u0e07\u0e1b\u0e38\u0e48\u0e21<\/p>\n\n\n\n<pre class=\"wp-block-code has-layout-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-a97453dbbe4f3076d1883dcb673cb146\"><code>btn.addEventListener('click', () =&gt; {\n  window.scrollTo({ top: 0, behavior: 'smooth' });\n});\n<\/code><\/pre>\n\n\n\n<p>\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e04\u0e25\u0e34\u0e01 \u2192 \u0e40\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e01\u0e25\u0e31\u0e1a\u0e44\u0e1b\u0e1a\u0e19\u0e2a\u0e38\u0e14\u0e41\u0e1a\u0e1a smooth<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h4 class=\"wp-block-heading\">\u2728 \u0e2a\u0e23\u0e38\u0e1b\u0e2a\u0e34\u0e48\u0e07\u0e17\u0e35\u0e48\u0e42\u0e04\u0e49\u0e14\u0e19\u0e35\u0e49\u0e17\u0e33\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14<\/h4>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>\u0e2a\u0e48\u0e27\u0e19<\/th><th>\u0e17\u0e33\u0e07\u0e32\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e44\u0e23<\/th><\/tr><\/thead><tbody><tr><td>XML Namespace<\/td><td>\u0e40\u0e1b\u0e34\u0e14\u0e01\u0e32\u0e23\u0e43\u0e0a\u0e49\u0e41\u0e17\u0e47\u0e01 Blogger<\/td><\/tr><tr><td>Viewport<\/td><td>\u0e17\u0e33\u0e40\u0e27\u0e47\u0e1a responsive<\/td><\/tr><tr><td>all-head-content<\/td><td>SEO meta \u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34<\/td><\/tr><tr><td>Header<\/td><td>Sticky + Navigation<\/td><\/tr><tr><td>Container<\/td><td>Grid layout \u0e41\u0e1a\u0e1a 2 \u0e04\u0e2d\u0e25\u0e31\u0e21\u0e19\u0e4c<\/td><\/tr><tr><td>Sidebar<\/td><td>\u0e27\u0e32\u0e07 widget \u0e08\u0e32\u0e01\u0e2b\u0e19\u0e49\u0e32 Layout<\/td><\/tr><tr><td>Main section<\/td><td>\u0e41\u0e2a\u0e14\u0e07\u0e42\u0e1e\u0e2a\u0e15\u0e4c\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34<\/td><\/tr><tr><td>CSS<\/td><td>\u0e2d\u0e2d\u0e01\u0e41\u0e1a\u0e1a UI \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14<\/td><\/tr><tr><td>Responsive<\/td><td>\u0e1b\u0e23\u0e31\u0e1a layout \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d<\/td><\/tr><tr><td>Back-to-top<\/td><td>\u0e1b\u0e38\u0e48\u0e21\u0e40\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e02\u0e36\u0e49\u0e19\u0e2d\u0e31\u0e15\u0e42\u0e19\u0e21\u0e31\u0e15\u0e34<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-5e1b94332455fd04902ba1b6c7b64e43\" style=\"color:#206221\">5. Blogger Full Features Sidebar \u0e0b\u0e49\u0e32\u0e22\u0e41\u0e25\u0e30\u0e02\u0e27\u0e32<\/h3>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-0ffff3a5d1c08d171a41e15148870f1d\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml' \n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b' \n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data' \n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n\n&lt;head&gt;\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt; \n  &lt;b:if cond='data:blog.isMobile'&gt; \n    &lt;meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'\/&gt; \n  &lt;b:else\/&gt; \n    &lt;meta content='width=1200, initial-scale=1.0' name='viewport'\/&gt; \n  &lt;\/b:if&gt; \n\n  &lt;b:include data='blog' name='all-head-content'\/&gt;\n  &lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n\n\n  &lt;link href='https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;600&amp;amp;display=swap' rel='stylesheet'\/&gt;\n\n  &lt;b:skin&gt;&lt;!&#91;CDATA&#91;\n    \/* ---------- Variables ---------- *\/\n    :root {\n      --primary-color: #008f7a;\n      --layout-max-width: 1200px;\n      --sidebar-width: 250px;\n    }\n\n    \/* ---------- Reset ---------- *\/\n    * { margin: 0; padding: 0; box-sizing: border-box; }\n\n    body {\n      font-family: 'Kanit', sans-serif;\n      background: #f7f9fc;\n      color: #333;\n      line-height: 1.6;\n    }\n\n    a { text-decoration: none; color: inherit; }\n    a:hover { color: var(--primary-color); }\n\n    header {\n      background: #fff;\n      padding: 15px 30px;\n      box-shadow: 0 2px 8px rgba(0,0,0,0.05);\n      position: sticky;\n      top: 0;\n      z-index: 100;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    header h1 { color: var(--primary-color); font-size: 1.5rem; }\n    nav ul { display: flex; gap: 20px; list-style: none; }\n    nav li { font-weight: 500; }\n\n    \/* ---------- Layout ---------- *\/\n    .container {\n      display: grid;\n      grid-template-columns: var(--sidebar-width) 1fr var(--sidebar-width);\n      gap: 20px;\n      max-width: var(--layout-max-width);\n      margin: 30px auto;\n      padding: 0 15px;\n    }\n\n    main { display: flex; flex-direction: column; }\n\n    .post-card {\n      background: #fff;\n      border-radius: 12px;\n      padding: 20px;\n      margin-bottom: 20px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n      transition: transform 0.3s;\n    }\n    .post-card:hover { transform: translateY(-4px); }\n    .post-card h2 { font-size: 1.3rem; margin-bottom: 10px; }\n    .post-card p { color: #666; }\n\n    \/* ---------- Sidebar ---------- *\/\n    .sidebar {\n      background: #fff;\n      border-radius: 12px;\n      padding: 20px;\n      box-shadow: 0 4px 12px rgba(0,0,0,0.05);\n      height: fit-content;\n    }\n    .sidebar h3 { font-size: 1.2rem; margin-bottom: 15px; color: var(--primary-color); }\n\n    \/* ---------- Footer ---------- *\/\n    footer {\n      background: #222;\n      color: #eee;\n      text-align: center;\n      padding: 20px;\n      margin-top: 40px;\n    }\n\n    \/* ---------- Back to Top ---------- *\/\n    .back-to-top {\n      position: fixed;\n      bottom: 20px;\n      right: 20px;\n      background: var(--primary-color);\n      color: #fff;\n      border: none;\n      border-radius: 50%;\n      width: 50px;\n      height: 50px;\n      font-size: 20px;\n      cursor: pointer;\n      display: none;\n      align-items: center;\n      justify-content: center;\n      box-shadow: 0 4px 8px rgba(0,0,0,0.15);\n    }\n    .back-to-top:hover { background: darken(var(--primary-color), 10%); }\n\n    \/* ---------- Responsive ---------- *\/\n    @media screen and (max-width: 1200px) {\n      .container { grid-template-columns: 200px 1fr 200px; }\n    }\n\n    @media screen and (max-width: 900px) {\n      .container { grid-template-columns: 1fr; }\n      .sidebar { margin-bottom: 20px; }\n    }\n  ]]>&lt;\/b:skin&gt;\n&lt;\/head&gt;\n\n&lt;body&gt;\n  &lt;!-- Header --&gt;\n  &lt;header&gt;\n    &lt;h1&gt;&lt;data:blog.title\/&gt;&lt;\/h1&gt;\n    &lt;nav&gt;\n      &lt;ul&gt;\n        &lt;li&gt;&lt;a expr:href='data:blog.homepageUrl'&gt;Home&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;About&lt;\/a&gt;&lt;\/li&gt;\n        &lt;li&gt;&lt;a href='#'&gt;Contact&lt;\/a&gt;&lt;\/li&gt;\n      &lt;\/ul&gt;\n    &lt;\/nav&gt;\n  &lt;\/header&gt;\n\n  &lt;!-- Container: Left Sidebar + Main + Right Sidebar --&gt;\n  &lt;div class=\"container\"&gt;\n    &lt;!-- Left Sidebar --&gt;\n    &lt;aside class=\"sidebar\"&gt;\n      &lt;h3&gt;Left Menu&lt;\/h3&gt;\n      &lt;b:section id='left-sidebar' class='sidebar-widgets' showaddelement='yes'\/&gt;\n    &lt;\/aside&gt;\n\n    &lt;!-- Main Content --&gt;\n    &lt;main&gt;\n      &lt;b:section id='main' class='main' showaddelement='yes'&gt;\n        &lt;b:widget id='Blog1' type='Blog' title='Blog Posts' visible='true'\/&gt;\n      &lt;\/b:section&gt;\n    &lt;\/main&gt;\n\n    &lt;!-- Right Sidebar --&gt;\n    &lt;aside class=\"sidebar\"&gt;\n      &lt;h3&gt;Right Menu&lt;\/h3&gt;\n      &lt;b:section id='right-sidebar' class='sidebar-widgets' showaddelement='yes'\/&gt;\n    &lt;\/aside&gt;\n  &lt;\/div&gt;\n\n  &lt;!-- Footer --&gt;\n  &lt;footer&gt;\n    &lt;p&gt;\u00a9 &lt;data:blog.title\/&gt; - Powered by Blogger&lt;\/p&gt;\n    &lt;p&gt;&lt;a href='\/\/siammakemoney.com' style='color:#00c9a7;'&gt;siammakemoney.com&lt;\/a&gt;&lt;\/p&gt;\n  &lt;\/footer&gt;\n\n  &lt;!-- Back to Top --&gt;\n  &lt;button id=\"back-to-top\" class=\"back-to-top\"&gt;\u2191&lt;\/button&gt;\n\n  &lt;script&gt;\n    const btn = document.getElementById('back-to-top');\n    window.addEventListener('scroll', () =&gt; {\n      btn.style.display = window.scrollY &gt; 200 ? 'flex' : 'none';\n    });\n    btn.addEventListener('click', () =&gt; {\n      window.scrollTo({ top: 0, behavior: 'smooth' });\n    });\n  &lt;\/script&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n\n\n<div class=\"gc-box green_type \" style=\"text-align:left;border-radius:20px;box-shadow: 0 10px 10px #00000007\">\n\t\t\t<div class=\"gc-box-icon\"><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<p>&#8211;primary-color: #008f7a; \/* \u0e2a\u0e35\u0e2b\u0e25\u0e31\u0e01 \u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e41\u0e01\u0e49\u0e44\u0e02\u0e44\u0e14\u0e49 <em>\/ <\/em><\/p>\n\n\n\n<p><em>&#8211;layout-max-width: 1200px; \/<\/em> \u0e1b\u0e23\u0e31\u0e1a\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07 Layout <em>\/ <\/em><\/p>\n\n\n\n<p><em>&#8211;sidebar-width: 250px; \/<\/em> \u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07 Sidebar *\/<\/p>\n\n<\/div>\n\t\t<\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-ed4f6e16883634f66d64472ead50c55f\" style=\"color:#206221\">6. \u0e25\u0e1a bullet (\u0e40\u0e04\u0e23\u0e37\u0e48\u0e2d\u0e07\u0e2b\u0e21\u0e32\u0e22\u0e08\u0e38\u0e14\u0e02\u0e49\u0e32\u0e07\u0e2b\u0e19\u0e49\u0e32)<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>(bullet \u0e08\u0e38\u0e14\u0e41\u0e1a\u0e1a\u0e19\u0e35\u0e49)<\/li>\n<\/ul>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-7282dbe01622145d2bbdad7d7d9c5483\"><code>ul, ol {\n  list-style: none !important;\n  padding-left: 0 !important;\n  margin-left: 0 !important;\n}\n<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-9bd7d90977c0f64af1cb7c66ba97d138\" style=\"color:#206221\">7. \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e23\u0e39\u0e1b\u0e20\u0e32\u0e1e\u0e02\u0e19\u0e32\u0e14 20\u00d720 px \u0e41\u0e1a\u0e1a\u0e07\u0e48\u0e32\u0e22\u0e46<\/h3>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-3682fc13d1c2d4f9c3abd867932e82e9\"><code>&lt;img src=\"https:\/\/example.com\/icon.png\" alt=\"icon\" width=\"20\" height=\"20\"&gt;<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-5804e4e072583fa3c0e6737c5813f506\" style=\"color:#206221\">8. \u0e40\u0e1e\u0e34\u0e48\u0e21 Font Awesome \u0e44\u0e2d\u0e04\u0e2d\u0e19 \u0e41\u0e1a\u0e1a\u0e07\u0e48\u0e32\u0e22 \u0e46<\/h3>\n\n\n\n<h4 class=\"wp-block-heading\">8.1 \u0e40\u0e1e\u0e34\u0e48\u0e21 Font Awesome CDN (\u0e16\u0e49\u0e32\u0e22\u0e31\u0e07\u0e44\u0e21\u0e48\u0e21\u0e35)<\/h4>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-08c2b5dc34560e370e2ec9c4f7d9de07\"><code>&lt;link href='https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.0\/css\/all.min.css' rel='stylesheet'\/&gt;<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">8.2 \u0e43\u0e2a\u0e48\u0e44\u0e2d\u0e04\u0e2d\u0e19 Font Awesome \u0e41\u0e25\u0e30\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14<\/h4>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-93050e11735413ccaf2aeba9474f68fe\"><code>&lt;i class=\"fa-solid fa-house\" style=\"font-size:20px;\"&gt;&lt;\/i&gt;<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">8.2 \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e2a\u0e35\u0e43\u0e2b\u0e49 \u0e44\u0e2d\u0e04\u0e2d\u0e19 Font Awesome<\/h4>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-0f0f0987efba8ed41be654375947e650\"><code>&lt;style&gt;\n.icon-small {\n  font-size: 20px;\n  color: #000; \/* \u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e2a\u0e35\u0e44\u0e2d\u0e04\u0e2d\u0e19\u0e44\u0e14\u0e49 *\/\n}\n&lt;\/style&gt;\n\n&lt;i class=\"fa-solid fa-heart icon-small\"&gt;&lt;\/i&gt;<\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-e88d3bc2b3ebf69b1e19dcc98aa7418d\"><code><code>&amp;amp;<\/code><\/code><\/pre>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity is-style-wide\"\/>\n\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-b24fa6b453fd062ef00a3696aea8d7f5\" style=\"color:#206221\">9. \u0e18\u0e35\u0e21 Blogger \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e21\u0e19\u0e39\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19\u0e2a\u0e27\u0e22\u0e46<\/h3>\n\n\n\n<pre class=\"wp-block-code has-orange-color has-secondary-background-color has-text-color has-background has-link-color wp-elements-b9eb73deaa3e5572a833efa0e472366a\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml' xmlns:b='http:\/\/www.google.com\/2005\/gml\/b' xmlns:data='http:\/\/www.google.com\/2005\/gml\/data' xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n &lt;head&gt;\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt; \n  &lt;b:if cond='data:blog.isMobile'&gt; \n   &lt;meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'\/&gt; \n  &lt;b:else\/&gt; \n   &lt;meta content='width=1100' name='viewport'\/&gt; \n  &lt;\/b:if&gt; \n  &lt;b:include data='blog' name='all-head-content'\/&gt;\n  &lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n&lt;b:skin&gt;&lt;!&#91;CDATA&#91;\n\/* Reset body *\/\nbody {\n  margin: 0;\n  height: 10vh;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background-color: #f4f4f4; \/* \u0e2a\u0e35\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 *\/\n}\n\n\/* Container \u0e40\u0e21\u0e19\u0e39 *\/\n.radio-inputs {\n  position: relative;\n  display: flex;\n  border-radius: 1rem;\n  background-image: linear-gradient(to right, #31c7c1, #499b87, #4a715b, #3d4a3b, #262724);\n  box-sizing: border-box;\n  font-size: 17px;\n  width: 80%;\n  padding: 1rem 1rem 0 1rem;\n}\n\n\/* \u0e0b\u0e48\u0e2d\u0e19 radio \u0e08\u0e23\u0e34\u0e07 *\/\n.radio-inputs .radio input {\n  display: none;\n}\n\n\/* \u0e1b\u0e38\u0e48\u0e21\u0e40\u0e21\u0e19\u0e39 *\/\n.radio-inputs .radio .name {\n  display: flex;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  border-top-left-radius: 0.5rem;\n  border-top-right-radius: 0.5rem;\n  border: none;\n  padding: 0.5rem 0.8rem;\n  color: #fff;\n  transition: all 0.15s ease-in-out;\n  position: relative;\n}\n\n\/* \u0e1b\u0e38\u0e48\u0e21\u0e17\u0e35\u0e48\u0e16\u0e39\u0e01\u0e40\u0e25\u0e37\u0e2d\u0e01 *\/\n.radio-inputs .radio input:checked + .name {\n  background-color: #FFFFFF;\n  font-weight: 600;\n  color: #000;\n}\n\n\/* Hover *\/\n.radio-inputs .radio input + .name:hover {\n  color: #fff;\n}\n.radio-inputs .radio input:checked + .name:hover {\n  color: #000;\n}\n\n\/* \u0e21\u0e38\u0e21\u0e42\u0e04\u0e49\u0e07\u0e2a\u0e27\u0e22 \u0e46 \u0e40\u0e27\u0e25\u0e32\u0e40\u0e25\u0e37\u0e2d\u0e01 *\/\n.radio-inputs .radio input:checked + .name::after,\n.radio-inputs .radio input:checked + .name::before {\n  content: \"\";\n  position: absolute;\n  width: 10px;\n  height: 10px;\n  bottom: 0;\n}\n\n.radio-inputs .radio input:checked + .name::after {\n  right: -10px;\n  border-bottom-left-radius: 300px;\n  box-shadow: -3px 3px 0px 3px #FFFFFF;\n}\n.radio-inputs .radio input:checked + .name::before {\n  left: -10px;\n  border-bottom-right-radius: 300px;\n  box-shadow: 3px 3px 0px 3px #FFFFFF;\n}\n]]>&lt;\/b:skin&gt;\n\n &lt;\/head&gt;\n &lt;body&gt;\n  &lt;!-- Navigation Menu --&gt;\n  &lt;div class='radio-inputs'&gt;\n    &lt;label class='radio'&gt;\n      &lt;input checked='' name='radio' type='radio'\/&gt;\n      &lt;span class='name'&gt;Home&lt;\/span&gt;\n    &lt;\/label&gt;\n    \n    &lt;label class='radio'&gt;\n      &lt;input name='radio' type='radio'\/&gt;\n      &lt;span class='name'&gt;HTML&lt;\/span&gt;\n    &lt;\/label&gt;\n\n    &lt;label class='radio'&gt;\n      &lt;input name='radio' type='radio'\/&gt;\n      &lt;span class='name'&gt;CSS&lt;\/span&gt;\n    &lt;\/label&gt;\n    \n    &lt;label class='radio'&gt;\n      &lt;input name='radio' type='radio'\/&gt;\n      &lt;span class='name'&gt;JS&lt;\/span&gt;\n    &lt;\/label&gt;\n    \n    &lt;label class='radio'&gt;\n      &lt;input name='radio' type='radio'\/&gt;\n      &lt;span class='name'&gt;PHP&lt;\/span&gt;\n    &lt;\/label&gt;\n    \n    &lt;label class='radio'&gt;\n      &lt;input name='radio' type='radio'\/&gt;\n      &lt;span class='name'&gt;Name&lt;\/span&gt;\n    &lt;\/label&gt;\n    \n    &lt;label class='radio'&gt;\n      &lt;input name='radio' type='radio'\/&gt;\n      &lt;span class='name'&gt;Menu&lt;\/span&gt;\n    &lt;\/label&gt;\n  &lt;\/div&gt;\n  &lt;!-- Main Section --&gt;\n  &lt;b:section class='main' id='main' showaddelement='yes'\/&gt;\n  \n\n&lt;\/body&gt;\n\n&lt;\/html&gt;<\/code><\/pre>\n\n\n<div class=\"gc-box notice_type icon_type\" style=\"text-align:left;border-radius:0px;\">\n\t\t\t<div class=\"gc-box-icon\"><svg x=\"0px\" y=\"0px\" viewBox=\"0 0 486.463 486.463\" > <g> <g> <path d=\"M243.225,333.382c-13.6,0-25,11.4-25,25s11.4,25,25,25c13.1,0,25-11.4,24.4-24.4 C268.225,344.682,256.925,333.382,243.225,333.382z\"\/> <path d=\"M474.625,421.982c15.7-27.1,15.8-59.4,0.2-86.4l-156.6-271.2c-15.5-27.3-43.5-43.5-74.9-43.5s-59.4,16.3-74.9,43.4 l-156.8,271.5c-15.6,27.3-15.5,59.8,0.3,86.9c15.6,26.8,43.5,42.9,74.7,42.9h312.8 C430.725,465.582,458.825,449.282,474.625,421.982z M440.625,402.382c-8.7,15-24.1,23.9-41.3,23.9h-312.8 c-17,0-32.3-8.7-40.8-23.4c-8.6-14.9-8.7-32.7-0.1-47.7l156.8-271.4c8.5-14.9,23.7-23.7,40.9-23.7c17.1,0,32.4,8.9,40.9,23.8 l156.7,271.4C449.325,369.882,449.225,387.482,440.625,402.382z\"\/> <path d=\"M237.025,157.882c-11.9,3.4-19.3,14.2-19.3,27.3c0.6,7.9,1.1,15.9,1.7,23.8c1.7,30.1,3.4,59.6,5.1,89.7 c0.6,10.2,8.5,17.6,18.7,17.6c10.2,0,18.2-7.9,18.7-18.2c0-6.2,0-11.9,0.6-18.2c1.1-19.3,2.3-38.6,3.4-57.9 c0.6-12.5,1.7-25,2.3-37.5c0-4.5-0.6-8.5-2.3-12.5C260.825,160.782,248.925,155.082,237.025,157.882z\"\/> <\/g> <\/g> <\/svg><\/div>\n\t\t\t\n\t\t\t<div class=\"gc-box-text\">\n\n<p>\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e43\u0e2a\u0e48 script \u0e01\u0e48\u0e2d\u0e19\u0e1b\u0e34\u0e14 &lt;\/body&gt; \u0e2b\u0e23\u0e37\u0e2d \u0e2b\u0e32\u0e41\u0e17\u0e47\u0e01 <code>&lt;head&gt;<\/code><\/p>\n\n\n\n<p>\u0e43\u0e0a\u0e49 <code>&amp;amp;<\/code> \u0e41\u0e17\u0e19 <code>&amp;<\/code> \u0e40\u0e2a\u0e21\u0e2d<\/p>\n\n\n\n<p>\u0e40\u0e17\u0e21\u0e40\u0e1e\u0e25\u0e15\u0e08\u0e30\u0e15\u0e49\u0e2d\u0e07\u0e21\u0e35\u0e41\u0e17\u0e47\u0e01 b:section \u0e2d\u0e22\u0e48\u0e32\u0e07\u0e19\u0e49\u0e2d\u0e22\u0e2b\u0e19\u0e36\u0e48\u0e07\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23<\/p>\n\n<\/div>\n\t\t<\/div>\n\n\n<h3 class=\"wp-block-heading has-text-color has-link-color wp-elements-a45a620893746e54ba961138cbe6075c\" style=\"color:#206221\">10. \u0e42\u0e04\u0e49\u0e14\u0e40\u0e17\u0e21\u0e40\u0e1e\u0e25\u0e15 Blogger (\u0e1e\u0e23\u0e49\u0e2d\u0e21 SEO)<\/h3>\n\n\n\n<pre class=\"wp-block-code has-secondary-background-color has-text-color has-background has-link-color wp-elements-88636fbb7771c9bb13ef7b511ea0a28a\" style=\"color:#ff8d22\"><code>&lt;?xml version=\"1.0\" encoding=\"UTF-8\" ?&gt;\n&lt;html xmlns='http:\/\/www.w3.org\/1999\/xhtml'\n      xmlns:b='http:\/\/www.google.com\/2005\/gml\/b'\n      xmlns:data='http:\/\/www.google.com\/2005\/gml\/data'\n      xmlns:expr='http:\/\/www.google.com\/2005\/gml\/expr'&gt;\n\n&lt;head&gt;\n\n  &lt;meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'\/&gt;\n\n  &lt;!-- VIEWPORT --&gt;\n  &lt;b:if cond='data:blog.isMobile'&gt;\n    &lt;meta name='viewport' content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0'\/&gt;\n  &lt;b:else\/&gt;\n    &lt;meta name='viewport' content='width=1100'\/&gt;\n  &lt;\/b:if&gt;\n\n  &lt;!-- Blogger HEAD --&gt;\n  &lt;b:include data='blog' name='all-head-content'\/&gt;\n\n  &lt;!-- TITLE --&gt;\n  &lt;title&gt;&lt;data:blog.pageTitle\/&gt;&lt;\/title&gt;\n\n  &lt;!-- ==========================\n        SEO META TAGS\n       ========================== --&gt;\n\n  &lt;!-- Meta Description --&gt;\n  &lt;meta name=\"description\" expr:content=\"data:blog.metaDescription\"\/&gt;\n\n  &lt;!-- Keywords --&gt;\n  &lt;meta name=\"keywords\" content=\"blogger, seo, website, travel, tutorial\"\/&gt;\n\n  &lt;meta name=\"author\" content=\"Your Name\"\/&gt;\n\n  &lt;!-- Open Graph (Facebook \/ LINE) --&gt;\n  &lt;meta property=\"og:title\" expr:content=\"data:blog.pageTitle\"\/&gt;\n  &lt;meta property=\"og:description\" expr:content=\"data:blog.metaDescription\"\/&gt;\n  &lt;meta property=\"og:type\" content=\"website\"\/&gt;\n  &lt;meta property=\"og:url\" expr:content=\"data:blog.url\"\/&gt;\n  &lt;meta property=\"og:image\" expr:content=\"data:blog.postImageUrl\"\/&gt;\n\n  &lt;!-- Twitter Card --&gt;\n  &lt;meta name=\"twitter:card\" content=\"summary_large_image\"\/&gt;\n  &lt;meta name=\"twitter:title\" expr:content=\"data:blog.pageTitle\"\/&gt;\n  &lt;meta name=\"twitter:description\" expr:content=\"data:blog.metaDescription\"\/&gt;\n  &lt;meta name=\"twitter:image\" expr:content=\"data:blog.postImageUrl\"\/&gt;\n\n  &lt;!-- Canonical --&gt;\n  &lt;link rel=\"canonical\" expr:href=\"data:blog.url\"\/&gt;\n\n  &lt;!-- Robots --&gt;\n  &lt;meta name=\"robots\" content=\"index, follow\"\/&gt;\n  &lt;meta name=\"googlebot\" content=\"index, follow\"\/&gt;\n\n  &lt;!-- Schema.org --&gt;\n  &lt;script type=\"application\/ld+json\"&gt;\n  {\n    \"@context\": \"https:\/\/schema.org\",\n    \"@type\": \"WebSite\",\n    \"url\": \"&lt;data:blog.homepageUrl\/&gt;\",\n    \"name\": \"&lt;data:blog.title\/&gt;\",\n    \"alternateName\": \"&lt;data:blog.title\/&gt;\"\n  }\n  &lt;\/script&gt;\n\n  &lt;!-- Favicon --&gt;\n  &lt;link rel=\"icon\" type=\"image\/png\" href=\"YOUR-FAVICON-URL.png\"\/&gt;\n\n  &lt;!-- ==========================\n        CSS ZONE\n       ========================== --&gt;\n  &lt;b:skin&gt;\n    &lt;!&#91;CDATA&#91;\n      \/* ----- Your CSS Here ----- *\/\n      body { font-family: sans-serif; }\n    ]]>\n  &lt;\/b:skin&gt;\n\n&lt;\/head&gt;\n\n&lt;body&gt;\n\n  &lt;!-- MAIN CONTENT SECTION --&gt;\n  &lt;b:section class='main' id='main' showaddelement='yes'\/&gt;\n\n  &lt;!-- CREDITS --&gt;\n  &lt;center&gt;&lt;a href=\"\/\/siammakemoney.com\/\"&gt;siammakemoney.com\/&lt;\/a&gt;&lt;\/center&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"\u3053\u306eBlogger\u30c6\u30fc\u30de\u4f5c\u6210\u521d\u5fc3\u8005\u5411\u3051\u30ac\u30a4\u30c9\u3067\u306f\u3001Blogger\u3067\u4f7f\u7528\u3055\u308c\u308bXML\u30b3\u30fc\u30c9\u306e\u57fa\u672c\u69cb\u9020\u3068\u3001CSS\u3092\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3057\u3066\u7f8e\u3057\u304f\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u306a\u30d6\u30ed\u30b0\u30c7\u30b6\u30a4\u30f3\u3092\u4f5c\u6210\u3059\u308b\u65b9\u6cd5\u3092\u89e3\u8aac\u3057\u307e\u3059\u3002\u307e\u305f\u3001\u30d8\u30c3\u30c0\u30fc\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u3001\u30b5\u30a4\u30c9\u30d0\u30fc\u3001\u30d5\u30c3\u30bf\u30fc\u306a\u3069\u306e\u4e3b\u8981\u8981\u7d20\u306b\u52a0\u3048\u3001Blogger\u306e\u69d8\u3005\u306a\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u306e\u4f7f\u3044\u65b9\u4f8b\u3082\u7d39\u4ecb\u3059\u308b\u3053\u3068\u3067\u3001\u8aad\u8005\u304c\u7406\u89e3\u3057\u3084\u3059\u304f\u3001\u72ec\u81ea\u306e\u30c6\u30fc\u30de\u958b\u767a\u306b\u5fdc\u7528\u3057\u3084\u3059\u3044\u3088\u3046\u306b\u3057\u3066\u3044\u307e\u3059\u3002","protected":false},"author":1,"featured_media":5433,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_singular_sidebar":"","csco_page_header_type":"","csco_page_load_nextpost":"","footnotes":""},"categories":[15,23,28],"tags":[238],"class_list":{"0":"post-5401","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-blogger","8":"category-website-creation","9":"category-html-css-javascript","10":"tag-blogger","11":"cs-entry"},"_links":{"self":[{"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/posts\/5401","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/comments?post=5401"}],"version-history":[{"count":22,"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/posts\/5401\/revisions"}],"predecessor-version":[{"id":5449,"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/posts\/5401\/revisions\/5449"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/media\/5433"}],"wp:attachment":[{"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/media?parent=5401"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/categories?post=5401"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/siammakemoney.com\/ja\/wp-json\/wp\/v2\/tags?post=5401"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}