طريقة تغير شكل العنوان و الترقيم في مدونات بلوجر بشكل احترافي
كثير منا يسال لماذا لا تظهر مدونتك في محركات البحث, والسبب هو عدم احترامك لمعايير السيو وان تجعل القارئ يطيل القراءه في موقعك والتنسيق في بلوجر من اهم العوامل التي تجمل شكل المقاله وتكملها وايضا لها عامل كبير في السيو وايضا يمكنك ان تدرج كلمات مفتاحيه في العناوين والترقيم.
لكي تتصدر به ايضا محركات البحث جوجل,ياهو,bing وغيرها من المحركات لذلك حاول اخي القارئ لهذه المقاله ان تهتم بقدر المستطاع بالمقاله لديك لانه كلما كانت اجمل واسهل سيطيل القارئ في موقعك وهذا سوف يرفع من معدل ترتيب موقعك في محركات البحث وحاول ايضا ان تهتم بعمليه تجميل المدونه بالاكواد اللازمه ولكن لا تضيف اي اضافة بلوجر قطع امامك لان هذا يؤثر على عمليه سرعة المدونه وتسبب تاثير كبير في فقدان الزوار.
طريقة تغير شكل التنسيق الترقيمي لمدونات بلوجر :-
1- تسجيل دخول مدونة بلوجر2- توجه الى التحرير من ثم تحرير HTML
3- ابحث عن الوسم ]]></b:skin> والصق الكود التالي فوقه
الشكل الاول
انسخ الكود الذي بالمربع
الشكل الثاني
/* -- Post Ol Custom -- */
.post ul{list-style:inherit;}
ol {
counter-reset:li;
list-style:none;
font-size:14px;
font-family:droid arabic kufi,hacen_saudi_arabiaregular;
padding:0;
margin-bottom:1em;
}
ol ol {margin:0 2em 0 0;}
.post ol li{
position:relative;
display:block;padding:0;
margin:.5em 2.5em .5em 0;
background:transparent;
color:#5E6066;text-decoration:none;
transition:all .3s ease-out;
}
.post ol li:hover{color:#E74C3C;}
.post ol li:before{
content:counter(li);
counter-increment:li;
position:absolute;
right:-2.5em;top:50%;
margin-top:-1em;
background:#F3F3F3;
color:#545457;
height:2.3em;
width:2em;
line-height:2em;
text-align:center;
font-weight:bold;
border:1px solid #DDD;
font-family:Electrolize,hacen_saudi_arabiaregular;
transition:all .3s ease-out;
}
.post ol li:hover:before{
background:#F3F3F3;
color:#DB2F2F;
border:1px solid #DDD;
}
.post ol li:after{
position:absolute;
content:'';
border: .4em solid transparent;
right:-.4em;
top:52%;
margin-top:-.4em;
transition:all .3s ease-out;
}
.post ol li:hover:after{right:-.4em;border-right-color:#EC4848;}
.post ol li span{
position:relative;
display:block;
padding:4px 8px;
margin-bottom:10px;
background:transparent;
color:#b0b1b8;
text-decoration:none;
transition:all .3s ease-out;
}
.post ol li span:hover{color:#fff;}
dl{margin:.5em 3em .5em 0em}
ol{list-style:decimal outside}
dt{font-weight:bold}
dd{margin:0 2em .5em 0}
/* Video */
.mudwnpv {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCZnpC38FurADs42gkMq8QJ0oj8HJ2paC32t3mKLo8CHRIwwY7dadg-hIP3C1mBe6nzKMtu9szcG3u6_kdOvGWHsdj6knUCOcbf_xNAhRwOzAb83WyfcFYKmqmHrYOzDWgf1gPk-LbK65t/s1600/mudwnpv.png") no-repeat scroll 0 center transparent;
height: 390px;
padding-top: 57px;
width: 500px;
text-align:center;
margin:0 auto;
}
الشكل الثالث
.post ol{
counter-reset:li;
list-style: none;
*list-style: decimal;
margin-right:0;
padding-right:0
}
.post ol li{
position:relative;
margin:0 15px 20px 0 !important;
padding:4px 10px 4px 5px !important;
list-style:none;
*list-style: decimal;
border-bottom:1px solid #e2e3e2;
background:#f2f2f2;
text-indent:14px;
}
.post ol li:before {
background:#E2E2E2;
color: #A5A5A5;
content: counter(li, decimal);
counter-increment: li;
font: bold 14px serif;
margin: 0 0 10px;
padding: 5px 3px !important;
position: absolute;
right: -9px;
text-align: right;
text-indent: 6px;
top: -5px;
width: 20px;
}
.post ol li:after {
border-color: transparent #aeaeae transparent ; /* color of the triangle behind */
border-style: solid;
border-width: 5px 5px 0 0;
content: "";
height: 0;
position: absolute;
right: 17px;
top: -5px;
width: 0;
} اختر اي شكل من الاثنين السابقين وضعه في موقعك ولا تقم بإضافة الاثنين لان هذا سوف يسبب مشاكل في الموقع ويقوم بعملية تبطيئ الموقع.
الاكواد منقول من مدونه مدون محترف
تعليقات
إرسال تعليق