Celestial Samnang: ប៊ូតុងដ៏ស្រស់ស្អាតចំនួនប្រាំមួយ សម្រាប់ប្លុករបស់អ្នក

វិលមកជួបគ្នាសារជាថ្មីទៀតហើយ ថ្ងៃនេះខ្ញុំបាទសូមបង្ហាញអ្នកទាំងអស់គ្នាពីវិធីសាស្រ្តក្នុងការដាក់បង្ហាញប៊ូតុងដ៏ស្រស់ស្អាតសម្រាប់ប្លុក ហើយប៊ូតុងនេះមានចំនួនប្រាំមួយ Styles សម្រាប់ឲ្យអ្នកជ្រើសរើសបូករួមនឹង Icon របស់ Font Awesome ផងដែរ។

១-សូមចូលទៅកាន់គណនីប្លុករបស់អ្នក
២-ចូលទៅកាន់ Theme បន្ទាប់មក Edit HTML
៣-ចម្លងកូដខាងក្រោមដាក់ពីខាងក្រោម <head>
ចំណាំ៖ ប្រសិនបើអ្នកមានកូដ Icon Font Awesome Version 5 រួចរាល់នៅក្នុងស្បែកប្លុកសូមរំលងចំណុចនេះ

កូដ

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.2/css/all.css" integrity="sha256-piqEf7Ap7CMps8krDQsSOTZgF+MU/0MPyPW2enj5I40=" crossorigin="anonymous" />

៤-ចម្លងកូដខាងក្រោមដាក់ពីខាងលើ ]]></b:skin>

កូដ

.post-body a.rst-button{display:inline-block;height:31px;background-color:#2196F3;font-size:13px;color:#ffffff;font-weight:400;line-height:31px;text-align:center;text-decoration:none;cursor:pointer;padding:0 15px;margin:5px;border-radius:2px;box-shadow:0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)}
.rst-button:before{font-family:'Font Awesome 5 Free';font-weight:900;display:inline-block;margin:0 5px 0 0}
a.rst-button.preview{background-color:#009688}
.rst-button.preview:before{content:"\f06e"}
a.rst-button.download{background-color:#2196F3}
.rst-button.download:before{content:"\f019"}
a.rst-button.donate{background-color:#FFC107}
.rst-button.donate:before{content:"\f4c0"}
a.rst-button.cart{background-color:#8BC34A}
.rst-button.cart:before{content:"\f07a"}
a.rst-button.phone{background-color:#FF5722}
.rst-button.phone:before{content:"\f3cd"}
a.rst-button.contact{background-color:#EC407A}
.rst-button.contact:before{content:"\f0e0";font-weight:400}
.post-body a.rst-button:hover{background-color:#222222;color:#ffffff}

៥-ចម្លងកូដខាងក្រោមដាក់ពីខាងលើ </body>

កូដ

<script type='text/javascript'>
//<![CDATA[
$(".post-body a").each(function () {
    var t = $(this),
        a = t.text().trim(),
        o = a.split("/"),
        s = o[0],
        d = o[1];
    o.pop();
    a.match("rst-button") && (t.addClass("rst-button").text(s), "rst-button" != d && t.addClass(d))
});
//]]>
</script>

៦-ចុចពាក្យ Save Theme។