اداة المشاركات الأخيرة بالتصنيفات

اداة المشاركات الأخيرة بالتصنيفات

يوجد الآن مشاهدة التعليقات : 8

الموضوع

اقرأ ايضًا

التعليقات

عن الكاتب

تعليمات

مرحبا مرة اخرى، في هذه التدوينة سوف تحصلون على اضافة تعرض اخر المشاركات التي بموقعك على أساس التسمية المختارة
هذه الإضافة مفيدة للمدونات التي بها العديد من المواضيع أو الأقسام، ومع أحدث المشاركات سيجد الزائر سهولة في الوصول إلى المقالات في التسميات التي يبحث عنها.
وفيما يتعلق بتصميم الإضافة فهو جد حديث بمعنى يتشكل بحجم القالب المتوفر بالموقع عكس الإضافات الأخرى ويمكن التحكم في عدد عرض المواضيع وكذلك اختيار ما يظهر بها حسب التسمية
النسخة الأولى : إضافة أداة للمشاركات الأخيرة بصور مصغرة
لمن أراد تركيبها على موقعه فليتابع الشرح بعد المعاينة
شرح طريقة التركيب
. ابحث بإستعمال CTRL+F عن ]]></b:skin> أو ضعه بين <style> </style> فوق </head>
2. ضع الكود التالي فوقه
li.recent-posts:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,0.14), 0 5px 10px 0 rgba(0,0,0,0.12), 0 5px 10px -5px rgba(0,0,0,0.2li.recent-posts:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,0.14), 0 5px 10px 0 rgba(0,0,0,0.12), 0 5px 10px -5px rgba(0,0,0,0.2)}
.recenthd,li.recent-posts{box-shadow:0 0 2px 0 rgba(0,0,0,.12),0 2px 2px 0 rgba(0,0,0,.24);background:#fff;border-radius:3px;overflow:hidden}
a.gorecent{float:left;font-size:11px;padding:5px 10px;margin:-4px}
.recenthd h2{display:inline-block;text-transform:uppercase;font-size:15px;margin:0}
.recenthd svg{float:right;margin-left:10px}
.recenthd{padding:15px;text-align:right;margin-bottom:10px}ul#recent-posts{margin:0;padding:0}
li.recent-posts:nth-child(12),li.recent-posts:nth-child(4),li.recent-posts:nth-child(8){}
li.recent-posts{transition:all .3s ease-in-out;list-style:none;padding:0;margin-bottom:20px;text-align:center;width:260px;max-width:100%;float:right;height:260px;margin-left:20px}
.title_post a{color:#515151}li.recent-posts a:hover{color:#111}
.title_post{height:30px;overflow:hidden;padding:10px;line-height:1.4;font-size:13.4px}
.recent-posts img{height:190px;width:100%}
a.gorecent{text-transform:uppercase;line-height:1.5;font-size:11px;font-weight:700;color:#fff;border:none;padding:7px 15px 7px;border-radius:5px;background:#1976d2;cursor:pointer;outline:0;box-shadow:0 2px 2px 0 rgba(154,154,154,.14),0 1px 5px 0 rgba(0,0,0,.12),0 3px 1px -2px rgba(0,0,0,.12);margin-left:7px}
@media screen and (max-width:768px){.howtouse{width:39%}#safe-wrapper{width:auto;padding:18px;margin:-100px 0 0}li.recent-posts{width:45.6%}}
@media screen and (max-width:480px){li.recent-posts{width:100%}}
3. ابحث عن هذا الكود </body> وضع الكود التالي فوقه
<script type='text/javascript'>
//<![CDATA[
// Recent Post Settings
var recentpost_url = "https://www.ar1web.co";
var numPosts = 9;
var recentpost_label = "قوالب بلوجر";
// Recent Post
function recentPosts(e){if(document.getElementById("recent-posts")){for(var t,s,r=e.feed.entry,n="",a=document.getElementById("recent-posts"),l=0;l<numPosts;l++){for(var c=0;c<numPosts;c++)if("alternate"==r[l].link[c].rel){s=r[l].link[c].href;break}"media$thumbnail"in r[l]?u=r[l].media$thumbnail.url.replace(/.*?:\/\//g,"//").replace(/\/s[0-9]+\-c/g,"/s300"):u="https://1.bp.blogspot.com/-jHWwEwTEwQ4/WJJ4k71QSYI/AAAAAAAApVc/XO_OitR_VGQS_Wquq1pv1h1D-dgiejSuQCLcB/s90/nothumb_large.png";var t=r[l].title.$t;n+='<li class="recent-posts"><a href="'+s+'" title="'+t+'" target="_blank"><img src="'+u+'" alt="'+t+'"></a><div class="title_post"><a href="'+s+'" title="'+t+'" target="_blank">'+t+"</a></div></li>"}a.innerHTML=n}}var rcp=document.createElement("script");rcp.src=recentpost_url+"/feeds/posts/default/-/"+recentpost_label+"?orderby=published&alt=json-in-script&max-results="+numPosts+"&callback=recentPosts",document.getElementsByTagName("head")[0].appendChild(rcp);
// Recent Post Title
var titlerecentpost = document.getElementById("xtitlex");
titlerecentpost.innerHTML='<div class="recenthd"><svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M0 0h24v24H0z" fill="none"/><path d="M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-1 9H9V9h10v2zm-4 4H9v-2h6v2zm4-8H9V5h10v2z"/></svg><h2>'+recentpost_label+'</h2><a class="gorecent" href="'+recentpost_url+'/search/label/'+recentpost_label+'" title="احدث المواضيع" target="_blank">المزيد</a></div>';
//]]>
</script>
* غير الرابط : https://www.ar1web.co
* var numPosts = 9; غير 9 بعدد المشاركات المراد اظهارها
* ضع تسمية بدل قوالب بلوجر
4. بعد ذلك، يرجى الانتقال إلى التخطيط >> إضافة أداة >> HTML/JAVASCRIPT
5. ثم ضع بها الكود التالي
<div id='xtitlex'></div>
<ul id='recent-posts'></ul>
6. حفظ.
ملحوظة:

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
5😊😉😀😁😎😍😜😑😇💖😯😱😭👍❓🍻

هناك 8 تعليقات:

  1. روووعة صديقي انا متابع من سنة 2014 ... كنا ننتظر رجوعك ...

    ردحذف
    الردود
    1. اهلا وسهلا بك، نفتخر بك كمتابع للمدونة شكرا

      حذف
  2. لدي مشكل عندما اغير الرابط لمدونتي لاتظهر المواضيع ولكن عندما اغير الرابط الى موقعك تظهر التدوينات ممكن حل

    ردحذف
    الردود
    1. هل وضعت تسمية من موقعك بدل قوالب بلوجر؟
      وتأكد من أن تضع رابط بـ http://

      حذف
    2. أنا مكود قوالب بللوجر والمشكلة فاجأتني ... جربت كل الحلول وغيرت https: ب http ولم ينجح الامر

      حذف
  3. ممكن نتواصل على فيس بوك او اي موقع تواصل اجتماعي

    ردحذف
  4. يمكنك التواصل معي عبر الأنستغرام
    https://www.instagram.com/houssambaha/

    ردحذف
  5. شكرا على الأضافه تعلم متابعيك منذ نشأه المدونه ننتظر القادم

    ردحذف

عن الكاتب :

إرشادات

    تحميل الملفات

    نستخدم بمدونتنا مواقع مختلفة في رفع الملفات ونوفر منها إثنان:
  • موقع : Mediafire
  • موقع :file-upload
  • باسوورد فك الضغط للملفات المضغوطة : Ar1web2014
  • تجدون روابط التحميل في القوالب والملحقات بجانب التدوينة أي بالسيدبار
  • كل ملحق أو قالب يوجد بالمدونة هو للإستعمال الشخصي فقط
  • إن تواجد رابط معطوب فالمرجو التبليغ عنه هنا، شكرا.
  • أين تجدنا؟

    بعيدا عن الصفحات المزورة أو المزيفة التي يحاول البعض من خلالها استغلال جهود فريق عمل عرب ويب، هذه هي حساباتنا وصفحاتنا الرسمية في الشبكات الاجتماعية، لا نمتلك سوى هذه الصفحات والحسابات وهي الوحيدة التي تتبع للمدونة : https://www.instagram.com/ar1web

    كلمة الختام

    في مدونة عرب ويب نسعى دوما جاهدين للتحسن والتقدم وليس ما تراه هو حدودنا! ونحن نقدر كثيرا زوارنا وآراؤهم فإن كان لديك أي اقتراح/نصيحة/ومضة مفيدة/نقد بناء أو ما إلى ذلك يمكنك مشاركتنا كل ما في جعبتك من خلال الإتصال بنا : istoretech3@gmail.com
أخر تعديل كان في يوم السبت 20 يونيو من سنة 2020 ، هذه الصفحة قابلة للتعديل وقت اللزوم