ដាក់ Popular Posts ធាតុក្រាហ្វិកសម្រាប់ Blogger

ថ្ងៃ​នេះ​ប្លក់ ​Play Learns ​សូម​បង្ហាញ​ជូន​លោក​អ្នក​នូវ​របៀប​វិធី​ថ្មី​ មួយ​គឺ​ការ​ដាក់ អត្ថបទ​ពេញ​និយម​  (POPULAR POST) ដែល​ភាគ​ច្រើននៅ​ក្នុង​ប្លក់​ ឬ​គេហ​ទំព័រ​ផ្សេងៗ​ភាគ​ច្រើន​មិន​ដែល​រំលង​នូវ​ការ​ដាក់​នេះ​ទេ ព្រោះ​ថា ដើម្បី​ឲ្យ​អ្នក​ទស្ស​នា​ដឹង​ថា តើ​អត្ថ​បទ​ណា​មួយ​ដែល​យើង​ដាក់​ប្រកាស​មាន​ប្រសិទ្ធ​ភាព​ (មើល​ច្រើន) ជាង​គេ។ ហើយ​គ្រាន់​តែ​ប្លែក​ត្រង់​ថា ការ​នោះ​មាន​ម៉ូត​យ៉ាង​ណា​យ៉ាង​ណី​នោះ​ស្រេច​តែ​គេ​ចង់។ Popular​​ Posts gadget 
 គឺ ​សម្រាប់​ដាក់​បង្ហាញ​អត្ថបទ​ដែល​មាន​អ្នក​អាន​ច្រើន​ជាង​គេ (គិត​ជា​ប្រចាំ​សប្ដាហ៍, ខែ និង​គ្រប់​ពេល) ដែល​មាន​ស្រាប់​ក្នុង​ប្រព័ន្ធBlogger​ ហើយវាក័អាចបន្ថែបកូដមួយចំនួនបាន
ផងដែរទៅតាមអ្មកដែលគេចង់ដាក់ហើយពេលនេះខ្ញុំនិងបង្ហាញ
ពីរបៀបដាក់ Popular Posts នូវក្នុងប្លុក សូមអនុវត្តដូវខាងក្រោមនេះៈ



 ជាដំបូងយើងត្រូវបន្ថែមប្រកាសពេញនិយមលំនាំដើមធាតុក្រាហ្វិកទៅក្នុងកំណត់ហេតុបណ្ដាញរបស់យើង។ អនុវត្តជំហានដ៏សាមញ្ញដូចខាងក្រោមដើម្បីបន្ថែមវា។
    ១  ចូលទៅ Blogger របស់អ្នក។
   ២  ចុច  Add a gadget ហើយជ្រើស  popular posts gadget 
 

 ៣  ឥឡូវនេះធ្វើការកំណត់ដូចខាងក្រោម:

•   ១ របៀប​ដាក់​កូដ Popular Posts

 ១ ចូល​ទៅ​កាន់ Template >> Edit HTML >> Proceed 
 ២ ស្វែងរក  ]]></b:skin>
 ៣ ឥឡូវនេះគ្រាន់តែកូដដូចខាងក្រោមបិទភ្ជាប់បិទភ្ជាប់  ]]></b:skin>

•  កូដ Popular Posts ទី១

 

.popular-posts ul li a {
    background: none repeat scroll 0 0 #222222;
    color: #FFFFFF;
    display: block;
    margin: 10px 0;
    padding: 25px 15px 30px;
    position: relative;
    text-decoration: none;
    transition: all 0.3s ease-out 0s;
 width: 85%;
}
.popular-posts ul li a:before {
    background: none repeat scroll 0 0 #2DB3E9;
    color: #FFFFFF;
    font-weight: 700;
    height: 2em;
    line-height: 2em;
    margin-left: 88%;
    padding: 4px;
    position: absolute;
    text-align: center;
    width: 2em;
    transition: all 0.2s ease-in-out 0s;
   -moz-transition: all 0.3s ease-in-out 0s;
}
.popular-posts ul li a:hover {
    opacity: 0.8;
}
.popular-posts ul li a:hover:before {
    border-left-color: #CCCCCC;
    left: -1px;
     -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
}
.popular-posts ul li:first-child + li + li + li + li + li + li + li + li + li a:before {
    content: "10";
}
.popular-posts ul li:first-child + li + li + li + li + li + li + li + li a:before {
    content: "9";
}
.popular-posts ul li:first-child + li + li + li + li + li + li + li a:before {
    content: "8";
}
.popular-posts ul li:first-child + li + li + li + li + li + li a:before {
    content: "7";
}
.popular-posts ul li:first-child + li + li + li + li + li a:before {
    content: "6";
}
.popular-posts ul li:first-child + li + li + li + li a:before {
    content: "5";
}
.popular-posts ul li:first-child + li + li + li a:before {
    content: "4";
}
.popular-posts ul li:first-child + li + li a:before {
    content: "3";
}
.popular-posts ul li:first-child + li a:before {
    content: "2";
}
.popular-posts ul li:first-child a:before {
    content: "1";
}
.item-snippet {
    display: none;
}
.PopularPosts .item-thumbnail {
    display: none;
}

•  កូដ Popular Posts ទី២

       .popular-posts li,.popular-posts .item-content{float:left;display:inline;list-style:none;}
    .popular-posts .item-snippet,.popular-posts .item-title,.feed-links{display:none;}p.description,aside li{font-size:12px;}.popular-posts ul li,.item-content,.item-thumbnail{margin:0!important;padding:0!important;}.sixcol,.left-main,.right-sidebar{width:50%;}
    #PopularPosts1 img {background: none repeat scroll 0 0 #FFFFFF;border: 1px solid #CCCCCC;border-radius: 110px 110px 110px 110px;padding: 4px;}

•  កូដ Popular Posts ទី៣

  .PopularPosts .item-title {
display:none;
}
.PopularPosts .widget-content ul li {
background: none repeat scroll 0 0 transparent;
float: right;
list-style: none outside none;
margin: 10px 0 0 !important;
padding: 0 !important;
}
.PopularPosts .item-thumbnail {
margin: 0 8px !important;
}
#PopularPosts1 img:hover{-moz-transform: scale(1.2) rotate(-350deg);-webkit-transform: scale(1.2) rotate(-350deg);-o-transform: scale(1.2) rotate(-350deg);-ms-transform: scale(1.2) rotate(-350deg);transform: scale(1.2) rotate(-350deg);-webkit-box-shadow: 0 0 0px rgba(255,0,0,.4), inset 0 0 0px rgba(255,255,255,1);-moz-box-shadow: 0 0 0px rgba(255,0,0,.4), inset 0 0 0px rgba(255,255,255,1);box-shadow: 0 0 0px rgba(255,0,0,.4), inset 0 0 0px rgba(255,255,255,1);}

.item-thumbnail img {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
transition: all 0.5s ease;
border: 3px solid #ccc;
height: 60px;
padding: 3px;
width: 60px;
}

•  កូដ Popular Posts ទី៤

                                     ចុចទីនេះ
   Title : ជា​ឈ្មោះ Gadget អ្នក​អាច​ដាក់​ជា​ភាសា​ខ្មែរ​បាន (ប្រកាស​ពេញ​និយម) Most viewed : បង្ហាញ​ចំណង​ជើង​ប្រកាស​ដែល​មាន​អ្នក​អាន​ច្រើន​ជាង​គេ ​គិតជា ក្នុង​​សប្ដាហ៍,
 ក្នុង​ខែ ឬ​ក៏ គ្រប់​ពេល។
  Show : កំណត់​ការ​បង្ហាញ​ចំណង​ជើង​ប្រកាស ភ្ជាប់​មក​ជាមួយ ៖
  image thumbnail : កំណត់​អោយ​បង្ហាញ​រូបភាព​តូច​ក្នុង​ប្រកាស​បើ​មាន (សូម​កុំ​ធីក)
  snippet : បង្ហាញ​អត្ថបទ​សង្ខេប​បន្តិច​ពី​ក្រោម​ចំណង​ជើង (សូម​កុំ​ធីក)
  Display up to ... post(s) : កំណត់​ចំនួន​បង្ហាញ​ចំណង់​ជើង​ប្រកាស​
 កំណត់​រួច​សូម​ចុច​ប៊ូតុង Save ដើម្បី​រក្សា​ទុក។ រួច​អ្នក​អា​ច​ចាប់​ទាញ Popular Posts Gadget ទៅ​ដាក់​នៅ​ទីតាំង​សមរម្យ ដែល​អ្នក​ចង់​បាន។
 សូមចុចលើ  Save button.។
 សូមអសគុណសូមមានសំណាល្អ៕