سكريبت تلقائي لإنشاء جدول الملاحة لمحتوى التدوينة

سكريبت رائع لإنشاء جدول الملاحة لمحتوى التدوينة table of contents فالمميز فيه أنه تلقائي أي لايحتاج ضبط أكواد العناوين والنصوص المملة والمعقدة في كل مرة
وقبل أن نتقل بكم لطريقة تركيب هذه الميزة دعنا نوضح مسألة مهمة وهي الحرص على تنسيق مواضيعك بشكل دقيق وإدراج العناوين لكي نساعد الإضافة بإعطاء أفضل نتيجة لها كما ستشاهد في المعاينة

تعريف بالإضافة

لمن لايعرف هذه الميزة فهي عبارة عن جدول المحتويات أو هي عبارة عن قائمة تتكون من نقاط أو أجزاء من الموضوع الوارد في المقال..إذ يمكننا استخدام "جدول المحتويات" كتحليل لمحتويات المقالة في شكل ارتباط بحيث يكون من السهل على القارئ اختيار المعلومات التي سيقرأها أو التنقل بين ثنايا التدوينة بكل سهولة وللتذكير فإننا غالبًا ما نعثر على جدول المحتويات على مواقع ويكيبيديا والموسوعات وكذلك ملفات PDF من الكتب الإلكترونية والتي يتم وضعها عادة بعد مقدمة المقال أو الفكرة الرئيسية لمقال.

معاينة الإضافة

• المعاينة

طريقة تركيب الإضافة

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

الخطوة الأولى

• إنتقل للمدونة >> ثم إلى المشاركات >> ثم قم بإنشاء تدوينة جديدة كالعادة ..
• الآن إنتقل من وضع   التأليف إلى HTML وقم بمسح كل الأكواد الموجودة
• ثم قم بنسخ الكود التالي وضعه داخل حقل المحرر مباشرة - أنظر الصورة الجامعة في الأسفل



<!-- allowtoc_Content -->



• إرجع لوضع التأليف وقم بكتابة التدوينة الخاصة بك ولاتنس إستخدام العناوين المناسبة لك كما شاهدت تنسيق التدوينة في صفحة المعاينة



ملاحظة:

بما أن صندوق المحتويات يأخذ مكانه في بداية الموضوع يجب ان نتفادى إلتقاط العناوين بدل النص وذلك عن طريق اضافة وصف البحث وانا انصحك بهذه الخطوة دائما عندما تكتب تدوينة فهي مفيدة لدى محركات البحث عند أرشفت منشوراتك .. والطريقة كالتالي...
• من خلال >> إعدادات المشاركات >> وصف البحث >> قم بكتابة ملخص الموضوع ثم إضغط >> تم - أنظر الصورة الجامعة في الأسفل

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

الخطوة الثانية

• إنتقل إلى المظهر >> ثم إضغط على تحرير  Edit HTML 
• إضغط في وسط محرر الأكواد  ثم   F + Ctrl لإضهار مربع البحث
• بإستعمال  الزر  C +Ctrl  للنسخ و  V +Ctrl  للصق قم بوضع الأكواد في المكان المناسب
• قم بالبحث عن هذا الوسم </body> فوقه أي قبله قم بوضع كود js  التالي..



HTML
<script type='text/javascript'>
        /*<![CDATA[*/
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('(j($){$.1G.2=j(o,p){p=$.1H({1e:"1I 1J L:",6:"1K",r:"#1L",Y:"f",1f:1g,Z:m.Z().1M(j(){M(m.1N===8)1h m.1O}).1P()},p);C N;M(p.1f==1i){N=[p.Z]==" 1Q "}1j{N=1g};M(N){v=\' #2-4{1k:1l;1R:1S;k:10-w;3:11 12 #O;13-9:#O;14:P 1T;x:0 P 1m;1n-Q:1U;Y:\'+p.Y+\';}#2-L{9:#1o;n-R:1V;n-15:1W;1X:1Y;x:P 0;}#2-4 a:1Z{20:"•";9:\'+p.r+\';x:0 g;k:10-w;n-R:1m;}#2-4 a{9:#21;n-R:22;x-23:g;k:w;1p:1q;}#2-4 a:S{9:\'+p.r+\';}.y-l 1r:z,.y-l 1s:z,.y-l 1t:z,.y-l 1u:z,.y-l 1v:z,.y-l 1w:z{14:P 0;9:\'+p.r+\';n-15:25;}#2-6{1k:1l;k:w;Q:26%;1p:1q;x:g 0;}h[1x="27"] #2-6{T-19:28;}h[1x="29"] #2-6{T-19:2a;}#2-6 a{9:2b;13-9:\'+p.r+\';3:11 12 \'+p.r+\';n-R:2c;k:10-w;1n-Q:2d;x:g;14:2e 2f;T-19:1y;n-15:1z;2g-1A:1z;}#2-6 a:S{9:#2h;13-9:#O;3:11 12 #O;}#2-4:S,#2-6 a:S{-U-D-E:0 g F G(0,0,0,0.16);-V-D-E:0 g F G(0,0,0,0.16);-W-D-E:0 g F G(0,0,0,0.16);-o-D-E:0 g F G(0,0,0,0.16);D-E:0 g F G(0,0,0,0.16);}#2-4{-U-3-c:H;-V-3-c:H;-W-3-c:H;-o-3-c:H;3-c:H;}#2-6 a{-U-3-c:I;-V-3-c:I;-W-3-c:I;-o-3-c:I;3-c:I;}#2-4 *{-U-A-B:f;-2i-A-B:f;-V-A-B:f;-W-A-B:f;-o-A-B:f;A-B:f;}\';!j(t){C e=1a.2j("v");e.2k=t,1a.l.2l(e)}(v);m.2m(\'<h J="2-4"><h J="2-L" 2n="" 2o="2p" 2q="0">\'+p.1e+\'<1B Q="18" 1A="18" 2r="0 0 24 24"><2s 2t="#1o" d="2u,18.2v.1C,2w.2x,16.2y,2z.2A,16.2B.17,2C,5.2D.17,2E.2F,7.2G,2H.2I,7.2J.1C,2K,5.2L" /></1B></h><X  J="2"></X></h>\').2M(o).2N(j(i){i=i+1;$(m).2O(\'J\',\'1b-\'+i).2P(o).2Q(\'1D+1D,p,h, 2R, 2S, 2T, 2U, 1r, 1s, 1t, 1u, 1v, 1w, p, 2V, 2W, a, 2X, 2Y, 2Z, 30, 31, 32, 33, 34, 35, 36, 37, 38, q, s, 39, 3a, 3b, 3c, 3d, 3e, 3f, C, b, u, i, 1y, X, 1c, 3g, 3h, 3i, 3j, 3k, 3l, 3m, 3n, 3o, 3p, 3q, 3r, 3s, 3t, 3u, 3v, 3w, 3x, 3y, 3z, 3A, 3B, 3C, 3D, 3E, 3F, 3G, 3H, 3I, 3J, 1b, 3K, 3L, 3M, 3N, 3O\').3P(\'<h J="2-6"><a 1d="#2-4">\'+p.6+\' ↑</a></h>\');$(\'<1c><a 1d="#1b-\'+i+\'">\'+$(m).T()+\'</a></1c>\').3Q(\'#2-4 X\')});$(\'#2-L\').1E("1F",j(){C 2=1a.3R("2");M(2.v.k==="f"){2.v.k="w"}1j{2.v.k="f"}});$(\'#2-4 a, a[1d="#2-4"]\').1E("1F",j(){C K=m.K;$(\'3S,l\').3T({3U:$(K).3V().6},3W,j(){3X.3Y.K=K});1h 1i})}}})(3Z);',62,248,'||toc|border|list||top|||color|||radius|||none|5px|div||function|display|body|this|font||||mincolor||||style|block|margin|post|target|user|select|var|box|shadow|8px|rgba|4px|30px|id|hash|Content|if|ext|f5f5f5|10px|width|size|hover|text|webkit|moz|ms|dl|float|contents|inline|1px|solid|background|padding|weight||||align|document|section|dt|href|title|Allallowtoc|true|return|false|else|position|relative|15px|min|000000|clear|both|h1|h2|h3|h4|h5|h6|dir|center|normal|height|svg|83|br|on|click|fn|extend|Table|of|Top|4d90fe|map|nodeType|nodeValue|get|allowtoc_Content|overflow|hidden|20px|180px|17px|700|cursor|pointer|before|content|777|13px|bottom||bold|100|rtl|left|ltr|right|white|11px|80px|2px|12px|line|cecece|khtml|createElement|innerHTML|appendChild|prepend|onclick|role|button|tabindex|viewBox|path|fill|M12|17L8|15L7|42|41L12|21L16|59|41L15|15M12|83L15|9L16|58|59L12|3L7|41|59L8|9L12|83Z|children|each|attr|nextUntil|not|span|applet|object|iframe|blockquote|pre|abbr|acronym|address|big|cite|code|del|dfn|emx|img|ins|kbd|samp|small|strike|strong|sub|sup|tt|dd|ol|ul|li|fieldset|form|label|legend|table|caption|tbody|tfoot|thead|tr|th|td|article|aside|canvas|details|embed|figure|figcaption|footer|header|hgroup|menu|nav|output|ruby|summary|time|mark|audio|video|after|appendTo|getElementById|html|animate|scrollTop|offset|600|window|location|jQuery'.split('|'),0,{}))

$(function() {
var post = $('.post-body div[dir]');
   $(post).toc('h1,h2,h3,h4,h5,h6', {
        title: "المحتويات",
        top: "رجوع",
        mincolor: "#4d90fe",
        float: "right",
        Allallowtoc: true,
    });
});
  /*]]>*/
 </script>





شرح الكود

المعرف title المحدد بهذا اللون خاص بعنوان جدول الملاحة ضع الإسم الذي يناسبك

المعرف top المحدد بهذا اللون خاص بإسم زر الصعود ضع الإسم الذي يناسبك

المعرف mincolor المحدد بهذا اللون خاص بلون الإضافة الإفتراضي يمكنك وضع كود اللون الذي تريده كقيمة مكان #4d90fe .

المعرف float المحدد بهذا اللون خاص بمكان وضعية جدول الملاحة لاحظ الاتي..
لجعل صندوق جدول الملاحة يأخذ جهة اليمين نضع القيمة right
لجعل صندوق جدول الملاحة يأخذ جهة اليسار نضع القيمة left
لجعل صندوق جدول الملاحة يأخذ كامل عرض الصفحة نضع القيمة none

المعرف Allallowtoc المحدد بهذا اللون مهم جدا فهو ميزة تتيح لك عرض جدول المحتوايات في كامل منشوراتك دفعة واحدة دون اللجوء إلى وضع أمر التنفيذ <!-- allowtoc_Content --> داخل المنشور طبعا في حال كانت مواضيعك منسقة بشكل جيد ... إذا لتفعيل هذه الخاصية قم بالأتي..
إستعمل القيمة true لتشغيل الإضافة في جميع منشوراتك
إستعمل القيمة false للتعطيل في جميع منشوراتك و عرض الإضافة فقط في حال وضعنا أمر التنفيذ <!-- allowtoc_Content --> داخل المنشور.

check_circle

للذين يريدون التعديل على السكربت يمكنهم تنزيل نسخة بدون ضغط من المرفقات