توجد اخطاء حاليا في جوجل مشرفي الموقع

اضافة محتويات المقال لمدونات بلوجر بطريقة تلقائية , كيفية عرض العناوين الفرعية في بداية المشاركة لمدونات بلوجر 

شرح مهم عن اضافة محتويات المقال في مدونات بلوجر والتي تسمي باللغة الانجليزية Table Of Content اليوم ستعرف طريقة وضعها بطريقة بسيطة جدا وساقوم بتبسيط الشرح باذن الله 

اضافة محتويات المقال لمدونات بلوجر

 
السلام عليكم متابعينا اليوم اضافة Table Of Content أي اضافة محتويات المقال في بدايه الموضوع لمدونات بلوجر , طريقة اليوم ستوفر عليك الكثير من أي اضافة اخري لمحتويات المقال، اذا كنت من متابعين الموقع ستعرف اننا لدينا مقال قديم عن  كيفية عمل قائمة محتويات الموضوع لمدونات بلوجر وكان عيب الاضافة انك يجب في كل مقال اضافة بعض الأكواد وهذا سيسبب مشكلة لأصحاب المواقع مثل موقعنا لدينا 465 مقال , لكي نضف محتويات المقال يجب بعض اكواد الاضافة في كل مقال وهذا شي سياخذ من وقتك لذلك نحن قررنا وضع هذه الاضافة بطريقة رائعة جدا ستعمل تلقائية لكل مقال وهذه صورة معاينة من الاضافة من قالب ادس بلس الذي قمنا بتصميمه . 

معاينة الاضافة/preview/button

كما ترون الصورة او في رابط المعاينة الأضافة تعمل بدون أي مشاكل داخل المقال وتلقائية أي لن تضطر لاضافتها في كل مقال تابع معي شرح وضع الاضافة . 

شرح وضع اضافة محتويات المقال

تنبيه :- قبل وضع أي شي قم بأخذ نسخة احتياطية من قالبك  alert-warning

قم بالذهاب الي المظهر ثم تعديل HTML ثم قم بالبحث عن 

</body> code-box

وضع هذا الكود قبله 

<script async='async' defer='defer'>
/* Made by nsafr.com */
var head,newLine,el,title,link,ToC=&quot;<nav class='table-of-contents' role='navigation'><h4 onclick='toc()'>محتويات المقال</h4><ul style='display:none'>&quot;;$(&quot;.post-body h2, .post-body h3&quot;).attr(&quot;id&quot;,function(arr){return &quot;point&quot; + arr;});$(&quot;.post-body h2,  .post-body h3&quot;).each(function(){el=$(this),title=el.text(),link=&quot;#&quot;+el.attr(&quot;id&quot;),ToC+=newLine=&quot;<li><a href='&quot;+link+&quot;'>&quot;+title+&quot;</a></li>&quot;}),ToC+=&quot;</ul></nav>&quot;,$(&quot;.toc-pro&quot;).prepend(ToC);function toc() {$(&quot;.table-of-contents ul&quot;).toggle();}
</script> code-box

ثم قم بالبحث عن هذا الكود

]]></b:skin> code-box

ثم قم باضافة هذا الكود قبله 

.table-of-contents{flex:auto;width:fit-content;background:#eee;font-size:14px;padding:11px;margin:8px 0 30px 0}
.table-of-contents li{margin:0 0 0.25em 0}
.table-of-contents a{color:#2a5365}
.table-of-contents h4{margin:0;cursor:pointer}
.table-of-contents h4:before{font-family:FontAwesome;content:"\f0c9";padding-left:7px;}code-box

ثم قم بحفظ القالب وقم بالتركيز في هذه النقطة , اذا كان في قالبك اداة لاضافة اعلان أعلي المقال فهذا جيد وان لم تكن لديك فقم باضافتها من خلال مقال  كيفية اضافة اعلانات ادسنس داخل مواضيع بلوجر . 
كل ماأحاول ان اوصله لكم ان في صورة المقال قمنا باضافة الكود الخاص باضافة محتويات المقال في اداة اعلان HTML/JAVASCRIPT اعلي المقال لذلك قم بالذهاب لهذه الأداة وقم باضافة هذا الكود داخل الأداة 

<div class="toc-pro"></div> code-box

 

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