تقسيم مقالات بلوجر لجعلها احترافية

مجلة رونق -  يعد تقسيم مقالات بلوجر من الطرق المثالية لمضاعفة أرباح جوجل وتقوية تحسين محركات البحث بالموقع.

وهذا ما سنقوم بشرحه بالتفصيل في مقال اليوم، حيث سأعرض عليكم كيفية تقسيم مقال بلوفر ووردبريس إلى صفحات مع الترقيم، وأعرض عليكم الإيجابيات وسلبيات القيام بهذه الطريقة على موقعك، سواء كان Blogger أو WordPress.

شرح لكيفية تقسيم مقال بلوجر و ووردبريس إلى صفحات مع الترقيم بإعلانات Google Adsense

ملاحظة مهمة: قبل أن نبدأ الوسوم قمت بعمل مسافات لهم حتى لا تختفي من المقال ، لذا أزل المسافات بين الكلمة والعلامات ، نفس الشيء. الكلمات الموجودة في منتصف "" هي روابط تدخلها للعثور على الرموز التي ستضعها في المظهر أو المقالة.

قم بالبحث عن الكود ]]></b:skin> وفوقه مباشرة ضع الكود التالي :

/* #44a248 تقسيم المقالات بلوجر  - لتغير اللون أبحث عن الكود */

.postNav{display:flex;flex-wrap:wrap;justify-content:center; font-size:90%;line-height:20px; color:#fefefe; margin-top:30px;margin-bottom:0}

.postNav > *{display:flex;align-items:center; padding:10px 13px;margin-bottom:10px; color:inherit;background-color:#44a248; border-radius:2px;text-decoration:none} .postNav > *:hover{opacity:.8}

.postNav .current{background-color:rgba(0,0,0,.03); color:#989b9f}

.postNav{font-size:13px; margin:50px 0} .postNav > *{padding:8px 15px;border-radius:2px;margin-bottom:8px} .postNav > *:not(:last-child){margin-right:8px}

  

نبحث عن هذا الوسم </body> وايضا فوقه نضع كود جافا سكربت التالي :

<b:if cond='data:view.isPost'>

<script>/*<![CDATA[*/ document.addEventListener('DOMContentLoaded', function() {function checkChildren(nodes, elemId){for(i=0;i<nodes.length;i++){if(nodes[i].id==elemId){return nodes[i];}else{return checkChildren(nodes[i].children, elemId);}}} function isNumeric(value) {var type = typeof value; return (type === 'number' || type === 'string') && !Number.isNaN(value - Number.parseFloat(value));} var nodes = document.querySelector('div.post-body').children; var splitdong = checkChildren(nodes, 'postSplit').innerHTML; var content = splitdong.split('<!--nextpage-->'); var url = window.location.href; var url = url.split('?page='); var no = url[1] + '&m=4'; var no = no.split('m'); var no = no[0]; var no = no.replace('&', ''); var url = url[0]; var i = 1; if( !isNumeric(no) ){var no = 1;} document.getElementById('postSplit').innerHTML = content[no-1]; if( content.length > 1 ) {document.getElementById('postSplit').innerHTML += "<div class='postNav' id='postPager'><span class='page current'>Pages :</span></div>";} if( no>1 ){document.getElementById('postPager').innerHTML += "<!-- <a href='"+url+"?page="+(no-1)+"' title='Previous Page'>Prev</a> -->";} content.forEach(function(item) { if( no == i ){document.getElementById('postPager').innerHTML += "<span class='current'>"+i+"</span>";} else {document.getElementById('postPager').innerHTML += "<a href='"+url+"?page="+i+"'>"+i+"</a>";} i++; }); if(content.length > no){ var nn = parseInt(no) + 1; document.getElementById('postPager').innerHTML += "<a href='"+url+"?page="+nn+"'>Next</a>";} }); /*]]>*/</script>

</b:if>

  

ومن ثم نستخدم هذا الكود في كتابة اي مقال متعدد الصفحات متى نحتاج اليه :

<b:if cond='data:view.isPost'>

  

<div id='postSplit'>

<h2>صفحة 1</h2>

<p>هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص أو العديد من النصوص الأخرى إضافة إلى زيادة عدد الحروف التى يولدها التطبيق.</p>

<!--nextpage-->

<h2>صفحة 2</h2>

<p>هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص أو العديد من النصوص الأخرى إضافة إلى زيادة عدد الحروف التى يولدها التطبيق.</p>

<!--nextpage-->

<h2>صفحة 3</h2>

<p>هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص أو العديد من النصوص الأخرى إضافة إلى زيادة عدد الحروف التى يولدها التطبيق.</p>

</div>