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

حصريات
فوتوشوب
شروحات
إضافات
قوالب

الصفحة غير موجودة ، 404

الصفحة أو الكلمة التى تبحث عنها غير موجوده على المدونة أو تم حذفها

يمكنك التبليغ عن رابط لا يعمل من هذا الصفحة التبليغ عن رابط لا يعمل

ويمكنك طلب ما تريده من هذه الصفحة الدعم الفنى

أو يمكنك العودة للصفحة الرئيسية أو البحث عن الصفحةو من جديد

العودة للرئيسية

الخميس، 24 مارس، 2016

سلايد شو حسب التسميات الإصدار الثالث



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


شرح كيفية تركيب شريط أحدث الأخبار على مدونتك تابع :

اولا قم بأخذ نسخة احتياطية من قالب مدونتك لنجنب حدوث اى مشكلة 

1- سوف تقوم بالبحث عن الوسم ]]></b:skin> ثم تقوم بوضع الكود التالى فوقه مباشرتاُ ( قبله )

/*Sliderwdbloog*/
body[data-main="false"] #wdbloog {display: none;}
#wdbloog {height: 400px;}
#wdbloog .widget-content {font-size: 0;}
.wdbloog {position: relative;overflow: hidden;}
.wdbloog-item {float: right;width: 33.33333333%;height: 100%;position: relative;display: table;}
.wdbloog-item-info {display: table-cell;vertical-align: middle;text-align: center;background: rgba(0, 0, 0, .7);position: relative;padding: 15px;}
.wdbloog-inside {height: 400px;}
.wdbloog .heading {margin-top: 20px;margin-bottom: 30px;text-transform: capitalize;font-size: 1.5rem;font-weight: 700;line-height: 1.6;color: #fff;}
button#right, button#left {position: absolute;top: 48%;z-index: 2;display: none;border: 0;background: rgba(0,0,0,.7);color: #fff;font-size: 1.4rem;width: 40px;height: 40px;text-align: center;line-height: 40px;border-radius: 50%;cursor: pointer;outline: 0;}
button#right {right: 15px;padding-left: 10px;padding-top: 2px;}
button#left {left: 15px;padding-right: 10px;padding-top: 2px;}
.wdbloog-category {color: #fff !important;font-family: 'Droid Arabic Kufi' , serif;font-size: 15px;font-weight: 500;text-transform: uppercase;display: inline-block;padding: 10px;background: #e83636;}
.wdbloog-post-info {color: #fff;font-size: .875rem;border-top: 1px solid #fff;border-bottom: 1px solid #fff;padding: 10px;margin: 0 55px;}
.wdbloog .writer { margin-left: 50px;font-size: 13px;}
i.fa.fa-comments.icon {margin-left: 5px;}
span.wdbloog-comments {font-size: 13px;}
i.fa.fa-user.icon {margin-left: 5px;}
/*Sliderwdbloog*/


2- سوف تقوم بالبحث عن الوسم </body> ثم تقوم بوضع الكود التالى فوقه مباشرتاُ ( قبله )

<script>
//<![CDATA[

/* Sliderwdbloog Widget
--------------------------------------*/
  var wdbloog = $('#wdbloog .widget-content');
  var wdbloogContent = wdbloog.text().trim();
  wdbloog.addClass('clearfix');

  if((wdbloogContent !== 'no') && (wdbloogContent !== '"no"')) {
    if(wdbloogContent !== "[recent]") {
      $.ajax({
        url: "/feeds/posts/default/-/"+ wdbloogContent +"?alt=json-in-script&max-results=3",
        type: "get",
        dataType: "jsonp",
        success: function (e) {

          var img  = new Array();
          var trtd = '';  
          var numOfEntries = e.feed.entry.length;

          for (var i = 0; i < numOfEntries; i++) {

            var entry = e.feed.entry[i];
            var posttitle = entry.title.$t;
            var posturl;
            var author = entry.author[0].name.$t;

            for (var k = 0; k < entry.link.length; k++) {
              if (entry.link[k].rel == 'alternate') {
                posturl = entry.link[k].href;
                break;
              }
            }

            if ("content" in entry) {
              var postcontent = entry.content.$t;
            }

            s = postcontent; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);

            if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
              img[i] = d;
              var post_image = img[i];
            } else {
              var post_image = no_image_url;
            }

            var post_category = entry.category[0].term;
            if(entry.category.length >= 2){
              if(post_category === wdbloogContent) {
                post_category = entry.category[1].term;
              }
            }
            var category = '<a class="wdbloog-category" href="/search/label/'+ post_category +'?max-results=10">'+ post_category +'</a>';

            var post_comments;
            for (var k = 0; k < entry.link.length; k++) {
              if ((entry.link[k].rel === 'replies') && (entry.link[k].type === 'text/html')) {
                post_comments = entry.link[k].title;
                break;
              }
            } 
            post_comments = parseInt(post_comments, 10);

            var trtd = trtd + '<div class="wdbloog-item" style="background: url('+ post_image +') no-repeat center;background-size: cover"><div class="wdbloog-item-info">'+ category +'<a href="'+ posturl +'" class="wdbloog-post-title"><h2 class="heading">'+ posttitle +'</h2></a><div class="wdbloog-post-info"><span class="writer"><i class="fa fa-user icon"></i>'+ author +'</span><span class="wdbloog-comments"><i class="fa fa-comments icon"></i>'+ post_comments +'</span></div></div></div>';

          }
          wdbloog.html('<div class="wdbloog"><button id="right"><i class="fa fa-chevron-right"></i></button><button id="left"><i class="fa fa-chevron-left"></i></button><div class="wdbloog-inside">' + trtd + '</div></div>');

          var right = $("#right");
          var left = $("#left");
          var inside = $(".wdbloog-inside");
          var item = $(".wdbloog-item").eq(0);

          var w = window.innerWidth;
          if (w <= 980) {
            inside.css("width", w*3 + "px");
            right.addClass("show");
            left.addClass("show");
            right.removeClass("hide");
            left.removeClass("hide");
          } else {
            inside.css("width", "auto");
            inside.css("marginright", "0px");
            right.addClass("hide");
            left.addClass("hide");
            right.removeClass("show");
            left.removeClass("show");
          }

          $(window).on("resize", function () {
            w = window.innerWidth;
            if (w <= 980) {
              inside.css("width", w*3 + "px");
              right.addClass("show");
              left.addClass("show");
              right.removeClass("hide");
              left.removeClass("hide");
            } else {
              inside.css("width", "auto");
              inside.css("marginright", "0px");
              right.addClass("hide");
              left.addClass("hide");
              right.removeClass("show");
              left.removeClass("show");
            }
          });

          function wdbloogL() {
            var marginright = inside.css("marginright");
            var width = item.outerWidth()*(-1);
            if (marginright === "0px") {
              inside.css("marginright", (width*2+"px"));
            } else if (marginright === (width*2+"px")) {
              inside.css("marginright", width+"px");
            } else {
              inside.css("marginright", "0px");
            }
          }

          function wdbloogR() {
            var marginright = inside.css("marginright");
            var width = item.outerWidth()*(-1);
            if (marginright === "0px") {
              inside.css("marginright", width+"px");
            } else if (marginright === (width+"px")) {
              inside.css("marginright", width*2);
            } else {
              inside.css("marginright", "0px");
            }
          }

          right.on("click", wdbloogL);
          left.on("click", wdbloogR);
        }
      });
    } else {
      $.ajax({
        url: "/feeds/posts/default?alt=json-in-script&max-results=3",
        type: "get",
        dataType: "jsonp",
        success: function (e) {

          var img  = new Array();
          var trtd = '';  
          var numOfEntries = e.feed.entry.length;

          for (var i = 0; i < numOfEntries; i++) {

            var entry = e.feed.entry[i];
            var posttitle = entry.title.$t;
            var posturl;
            var author = entry.author[0].name.$t;

            for (var k = 0; k < entry.link.length; k++) {
              if (entry.link[k].rel == 'alternate') {
                posturl = entry.link[k].href;
                break;
              }
            }

            if ("content" in entry) {
              var postcontent = entry.content.$t;
            }

            s = postcontent; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);

            if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
              img[i] = d;
              var post_image = img[i];
            } else {
              var post_image = no_image_url;
            }

            var post_category = entry.category[0].term;
            if(entry.category.length >= 2){
              if(post_category === wdbloogContent) {
                post_category = entry.category[1].term;
              }
            }
            var category = '<a class="wdbloog-category" href="/search/label/'+ post_category +'?max-results=10">'+ post_category +'</a>';

            var post_comments;
            for (var k = 0; k < entry.link.length; k++) {
              if ((entry.link[k].rel === 'replies') && (entry.link[k].type === 'text/html')) {
                post_comments = entry.link[k].title;
                break;
              }
            } 
            post_comments = parseInt(post_comments, 10);

            var trtd = trtd + '<div class="wdbloog-item" style="background: url('+ post_image +') no-repeat center;background-size: cover"><div class="wdbloog-item-info">'+ category +'<a href="'+ posturl +'" class="wdbloog-post-title"><h2 class="heading">'+ posttitle +'</h2></a><div class="wdbloog-post-info"><span class="writer"><i class="fa fa-user icon"></i>'+ author +'</span><span class="wdbloog-comments"><i class="fa fa-comments icon"></i>'+ post_comments +'</span></div></div></div>';

          }
          wdbloog.html('<div class="wdbloog"><button id="right"><i class="fa fa-chevron-right"></i></button><button id="left"><i class="fa fa-chevron-left"></i></button><div class="wdbloog-inside">' + trtd + '</div></div>');

          var right = $("#right");
          var left = $("#left");
          var inside = $(".wdbloog-inside");
          var item = $(".wdbloog-item").eq(0);

          var w = window.innerWidth;
          if (w <= 980) {
            inside.css("width", w*3 + "px");
            right.addClass("show");
            left.addClass("show");
            right.removeClass("hide");
            left.removeClass("hide");
          } else {
            inside.css("width", "auto");
            inside.css("marginright", "0px");
            right.addClass("hide");
            left.addClass("hide");
            right.removeClass("show");
            left.removeClass("show");
          }

          $(window).on("resize", function () {
            w = window.innerWidth;
            if (w <= 980) {
              inside.css("width", w*3 + "px");
              right.addClass("show");
              left.addClass("show");
              right.removeClass("hide");
              left.removeClass("hide");
            } else {
              inside.css("width", "auto");
              inside.css("marginright", "0px");
              right.addClass("hide");
              left.addClass("hide");
              right.removeClass("show");
              left.removeClass("show");
            }
          });

          function wdbloogL() {
            var marginright = inside.css("marginright");
            var width = item.outerWidth()*(-1);
            if (marginright === "0px") {
              inside.css("marginright", (width*2+"px"));
            } else if (marginright === (width*2+"px")) {
              inside.css("marginright", width+"px");
            } else {
              inside.css("marginright", "0px");
            }
          }

          function wdbloogR() {
            var marginright = inside.css("marginright");
            var width = item.outerWidth()*(-1);
            if (marginright === "0px") {
              inside.css("marginright", width+"px");
            } else if (marginright === (width+"px")) {
              inside.css("marginright", width*2);
            } else {
              inside.css("marginright", "0px");
            }
          }

          right.on("click", wdbloogL);
          left.on("click", wdbloogR);
        }
      });
    }
  } else {
    $("#wdbloog").remove()
  }

//]]>
</script>


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

<b:section id='wdbloog' maxwidgets='1' showaddelement='yes'>
      <b:widget id='HTML93' locked='false' title='The wdbloog' type='HTML'>
        <b:includable id='main'>
          <div class='widget-content'>
            <data:content/>
          </div>
          <b:include name='quickedit'/>
        </b:includable>
      </b:widget>
    </b:section>

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

والى هنا ينتهى الشرح اذا واجهتك اى مشكلة فى تركيب السلايد او تريد التعديل على اى شئ فباب التعليقات مفتوح لا تتردد ! وادعمنا بمشاركة التدوينة ليستفيد منها الجميع :)


شارك الموضوع ليستفيد الجميع

مواضيع قد تهمك ايضا

هناك 21 تعليقًا:

اضافة جميل اخي الله يوفقك انت الافضل

ممكن ترسل لي هدا القالب

http://abdocr2.blogspot.com.eg/

شكرا لك اخى على دعمك لنا

من فضلك اخى قم بطلب القالب من الموضوع الخاص به

هذا موضوع القالب الذى تريده
http://wdbloog.blogspot.com/2016/03/blog-post_15.html

العفو اخى فى خدمتك دائما

ممكن تركيب سلايد شو عندى في القالب

اوكى اخى قوم بوضع مشرف فى مدونتك سوف أقوم بتركيبه لك abdocr251@gmail.com

أخي ممكن مساعدة مدونتي تبعثرت كثيرا ممكن تساعدني أرجوك

ما المشكلة اخى الذى تواجهك ضع رابط مدونتك

وأنا كمان مش عرف اركبه

ممكن تركبلي السلايد شو أرجوك

اريد ازالة اسم الكاتب وعدد التعليقات

قم بعمل لـ div الخاص بهما display: none;

حسنا اخى فهمت شكرا لك .

شكرا على السلايد الرائع .. لدي أستفسار .. كيف أجعل السلايد يعرض جميع مشاركات المدونة؟

هكذا هو يعمل أخى
ولن تستطيع ذلك لانه سوف يحتاج خبرة فى الجافا

يسعدنا تفاعلكم بالتعليق ولكن نرجو منكم أن يكون خاص بالموضوع
الأبتساماتأخفاء الأبتسامات

Mohon Aktifkan Javascript!Enable JavaScript

إتصل بنا

الإسم الكريم البريد الإلكتروني مهم الرسالة مهم
جميع الحقوق محفوظة لـ عالم المدون | قوالب بلوجر,اضافات بلوجر, دروس وشروحات بلوجر