ជាទូទៅម្ចាស់គេហទំព័រ/ប្លក តែងតែដាក់ Popular Posts Gadget ដើម្បីបង្ហាញប្រកាសដែលពេញនិយម
ដើម្បីអោយអ្នកចូលទស្សនាបានដឹងថា គេហទំព័រដែលគេកំពុងមើលនេះ
មានអត្ថបទអ្វីដែលទទួលបានការចាប់អារម្មណ៍ មានអ្នកមើលច្រើនជាងគេ។ Popular Posts gadget គឺសម្រាប់ដាក់បង្ហាញអត្ថបទដែលមានអ្នកអានច្រើនជាងគេ
(គិតជាប្រចាំសប្ដាហ៍, ខែ និងគ្រប់ពេល)
ដែលមានស្រាប់ក្នុងប្រព័ន្ធ Blogger តែពេលនេះខ្ញុំសូមបង្ហាញពីរបៀបដាក់កូដ
ធ្វើឲ្យ Popular Posts
gadget មានផ្ទៃពណ៌ចំរុះ
មើលទៅស្រស់ស្អាត ទាក់ទាញភ្នែកអ្នកចូលទស្សនាប្លក។ សូមមើលពីរបៀបដាក់ខាងក្រោមនេះ៖
នៅក្នុងប្រព័ន្ធ
Blogger មាន Popular Posts gadget ស្រាប់រង់ចាំតែលោកអ្នកបើកប្រើតែប៉ុណ្ណោះ
ដូច្នេះលោកអ្នកត្រូវបើកវាអោយដំណើរការជាមុនសិនដោយ៖
- កត់ត្រាចូល (Log In) គណនី Blogger របស់លោកអ្នក
- ចូលទៅ Layout >> Addd a Gadget (សូមមើលរូបខាងក្រោម)
- រមូល (Scroll) ចុះក្រោមរកមើល
Gadget ឈ្មោះថា Popular Posts (សូមមើលរូបខាងក្រោម)
- ចុចលើវាដើម្បីកំណត់លក្ខខណ្ឌអោយកូនកម្មវិធី
Popular Posts Gadget
- Title : ជាឈ្មោះ Gadget អ្នកអាចដាក់ជាភាសាខ្មែរបាន
(ប្រកាសពេញនិយម) ឬក៏មិនបាច់ដូរក៏បាន។
- Most
viewed : បង្ហាញចំណងជើងប្រកាសដែលមានអ្នកអានច្រើនជាងគេ
គិតជា ក្នុងសប្ដាហ៍, ក្នុងខែ ឬក៏ គ្រប់ពេល
(ខ្ញុំសូមអោយអ្នករើសយកគិតជាខែគឺ Last 30 days)
- Show : កំណត់ការបង្ហាញចំណងជើងប្រកាស
ភ្ជាប់មកជាមួយ៖
+ image thumbnail : កំណត់អោយបង្ហាញរូបភាពតូចក្នុងប្រកាសបើមាន
(សូមកុំធីក)
+ snippet : បង្ហាញអត្ថបទសង្ខេបបន្តិចពីក្រោមចំណងជើង
(សូមកុំធីក)
- Display up
to ... post(s) : កំណត់ចំនួនបង្ហាញចំណង់ជើងប្រកាស
(ខ្ញុំសូមអោយអ្នកបង្ហាញច្រើនបំផុតតែប្រាំបួន (9) ចំណងជើងប្រកាសល្បីៗបានហើយ ។
- កំណត់រួចសូមចុចប៊ូតុង Save ដើម្បីរក្សាទុក។ រួចអ្នកអាចចាប់ទាញ Popular Posts Gadget ទៅដាក់នៅទីតាំងសមរម្យ ដែលអ្នកចង់បាន
(ឧទាហរណ៍ នៅខាងក្រោមគេបំផុតក្នុងផ្នែកខាងស្ដាំ)។
- នោះលោកអ្នកនឹងទទួលបានលទ្ធផលស្រដៀងរូបខាងក្រោមនេះ៖
- ឃើញថាការដាក់ Popular Posts Gadget ខាងលើ
គ្រាន់តែជាការតាមបែបធម្មតា (ដែលមានស្រាប់ក្នុង Blogger) គឺមិនទាន់មានផ្ទៃពណ៌ចំរុះនៅឡើយទេ
ដូច្នេះដើម្បីអោយវាមានពណ៌ចំរុះ យើងត្រូវបន្ថែមកូដចូលក្នុង Template ។
របៀបដាក់កូដ
"ផ្ទៃពណ៌ចំរុះ" ទៅអោយ Popular Posts Gadget
- បម្រុងទុក Tamplate របស់ប្លកលោកអ្នកជាមុនសិន
(ដើម្បីបង្ការ)
- ចូលទៅកាន់ Template >> Edit HTML >>
Proceed (សូមមើលរូបខាងក្រោម)
-ស្វែងរកពាក្យថា ]]></b:skin> (បើសិនជាចង់លឿនសូមចុច : F3 ឬ Ctrl+F រួចវាយ
ពាក្យស្វែងរកខាងលើ ក្នុងប្រអប់ស្វែងរករបស់ Browser។
- ចម្លងកូដខាងក្រោមយកទៅបិទភ្ជាប់ពីលើពាក្យ ]]></b:skin> រួចចុចប៊ូតុង Preview ដើម្បីមើលសាកល្បងសិន។
បើត្រឹមត្រូវហើយ សូមចុចប៊ូតុង Save Template ជាការស្រេច (សូមមើលរូបខាងក្រោម)
កូដ
ផ្ទៃពណ៌ចម្រុះ សម្រាប់ Popular
Posts Widget
#PopularPosts1
ul li a:hover{color:#fff;text-decoration:none}
#PopularPosts1
ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #333333; display: block; font-family:
Georgia, 'Times New Roman', Times, serif; font-size: 13px; font-style: normal;
font-variant: normal; font-weight: normal; letter-spacing: normal; line-height:
18px; margin: 0px 40px 0px 0px; min-height: 30px; orphans: 2; padding: 0px;
text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px;
text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;}
#PopularPosts1
ul li
.item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:51px;height:51px}
#PopularPosts1
ul li:first-child:after,
#PopularPosts1
ul li:first-child + li:after,
#PopularPosts1
ul li:first-child + li + li:after,
#PopularPosts1
ul li:first-child + li + li + li:after,
#PopularPosts1
ul li:first-child + li + li + li + li:after,
#PopularPosts1
ul li:first-child + li + li + li + li + li:after,
#PopularPosts1
ul li:first-child + li + li + li + li + li + li:after,
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li + li:after,
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li + li +
li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px
solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px
#000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff}
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li
{background:#DF01D7;width:90%}
#PopularPosts1
ul li:first-child + li + li + li + li + li + li +
li:after{content:"8"}
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li
+li{background:#B041FF;width:90%}
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li +
li:after{content:"9"}
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:90%}
#PopularPosts1
ul li:first-child + li + li + li + li + li + li + li + li +
li:after{content:"10"}
#PopularPosts1
ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:90%}
#PopularPosts1
ul li:first-child + li + li + li + li + li:after{content:"6"}
#PopularPosts1
ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:90%}
#PopularPosts1
ul li:first-child + li + li + li + li + li + li:after{content:"7"}
#PopularPosts1
ul li:first-child + li + li + li + li{background:#33c9f7;width:90%}
#PopularPosts1
ul li:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1
ul li:first-child + li + li + li{background:#c7f25f;width:90%}
#PopularPosts1
ul li:first-child + li + li + li:after{content:"4"}
#PopularPosts1
ul li:first-child + li + li{background:#ffde4c;width:90%}
#PopularPosts1
ul li:first-child + li + li:after{content:"3"}
#PopularPosts1
ul li:first-child + li{background:#ff764c; width:90%}
#PopularPosts1
ul li:first-child + li:after{content:"2"}
#PopularPosts1
ul li:first-child{background:#ff4c54 ;width:90%}
#PopularPosts1
ul li:first-child:after{content:"1"}
#PopularPosts1
ul{margin:0;padding:0px 0;list-style-type:none}
#PopularPosts1
ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px
solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px
#000;padding:10px}
- នោះលោកអ្នកនឹងទទួលបានលទ្ធផលស្រដៀងរូបខាងក្រោមនេះ៖
ឃើញថាបន្ទាប់ពីបញ្ចូលកូដរួចហើយ Popular Posts Gadget ប្រែទៅជាមានផ្ទៃពណ៌ចំរុះយ៉ាងស្រស់ឆើត
គួរអោយគយគន់។ ប៉ុន្តែមានបញ្ហាបន្តិចត្រង់ថា
លេខរៀងស្ថិតមិនចំកណ្ដាលរង្វង់មូល ប្រហែលជាមកពីពុម្ពអក្សរ។
សូមរីករាយជាមួយការដាក់ "ប្រកាសពេញនិយម ដែលមានផ្ទៃពណ៌ចំរុះ"៕