كيفية تقسيم المقال في بلوجر إلي عدة صفحات مرقمة

مرحبًا بمتابعين يا مينت ويب، في هذه المقال، سأشارك كيفية تقسيم المقال في بلوجر إلي عدة صفحات.


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


بالنسبة لمن يفضلون  كتابة مقالات طويلة مثلي😄، سيكون تقسم المقال مفيدًا جدًا ، بالإضافة إلى أن المدونة تبدو أكثر إتقانًا، يمكن أن توفر أيضًا تجربة قراءة أفضل.


للمعاينة ستجد في الأسفل أنه تم تقسيم المقال لمعاينته.

كيفية تقسيم مقال بلوجر إلى صفحات مع الترقيم

لا تنسي أخذ نسخة إحتياطية من القالب

انتقل إلى لوحة تحكم بلوجر المظهر انقر فوق وقم بإتباع التعليمات التالية


للبحث في أي شيء في بلوجر اضغط على Ctrl + F واكتب أو الصق المصطلح للبحث في شريط البحث.


انسخ كود css أدناه والصقه فوق الرمز ]]></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}

وأخيراً قم بنسخة كود Javascript التالي و لصقه اعلي الوسم </body> أو &lt;!--</body>--&gt;&lt;/body&gt; وأخير قم بالضغط علي حفظ.


<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>
  


كيف تستخدم تقسيم المقالات في بلوجر؟

عند إنشاء مقال ، يجب عليك استخدام علامة html أدناه ، لذلك يجب أن يكون النص والصور الخاصة بك فيها.


  <div id='postSplit'>
<!-- يٌكتب المقال هنا -->
</div>
    

ويجب أن تنتهي كل مقالة منفصلة في الصفحة التالية بعلامة التعليق على النحو التالي ، باستثناء الصفحة الأخيرة.


<!--nextpage-->
    

في الشكل النهائي يجب ان يكون المقال علي النحو التالي في وضع HTML


<div id='postSplit'>

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

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

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

</div>
      

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