5/17/2018

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






قم بالمعاينة المباشرة للأداة قبل الشروع في طريقة التركيب

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

الخطوة الأولى [تركيب الأداة]

  • قم بتسجيل حسابك ثم إذهب إلى منصة البلوجر dashboard
  • إنتقل للمدونة >> ثم إلى التخطيط >> من القائمة الجانبية قم بإضافة أداة   قائمة الروابط 
  • ملاحظة مهمة
    لاتنسى إعطاء الأداة الجديدة إسم فريد حتى يسهل البحث عليه ولنفترض يكون الإسم مواقع ندعمها ثم قم بنسخ هذا الإسم بعدها حفظ للأداة .
  • إنتقل الآن إلى >> المظهر >> ثم إضغط على تحرير  Edit HTML 
  • إضغط في وسط محرر الأكواد  ثم   F + Ctrl لإضهار مربع البحث
  • ضع الإسم الذي نسخته في مربع البحث ثم Enter ليظهر معك كود الأداة الجديدة بهذا الشكل مثلا

  • ماعليك الآن سوى إستبدال كامل كود الأداة بالكود الآتي ...ثم حفظ للقالب

  • 
                  <b:widget id='LinkList174' locked='true' title='مواقع ندعمها' type='LinkList' version='1'>
                    <b:widget-settings>
                      <b:widget-setting name='link-3'>#</b:widget-setting>
                      <b:widget-setting name='sorting'>NONE</b:widget-setting>
                      <b:widget-setting name='text-1'>ضع موقعك هنا</b:widget-setting>
                      <b:widget-setting name='link-1'>#</b:widget-setting>
                      <b:widget-setting name='text-0'>ضع موقعك هنا</b:widget-setting>
                      <b:widget-setting name='link-2'>#</b:widget-setting>
                      <b:widget-setting name='text-3'>ضع موقعك هنا</b:widget-setting>
                      <b:widget-setting name='link-0'>#</b:widget-setting>
                      <b:widget-setting name='text-2'>ضع موقعك هنا</b:widget-setting>
                    </b:widget-settings>
                    <b:includable id='main'>
     <div class='widget-content'>
       <ul>
         <b:loop values='data:links' var='link'>
           <li><a expr:href='data:link.target'><data:link.name/></a></li>
         </b:loop>
       </ul>
                <script type='text/javascript'> 
                //<![CDATA[
                $("#LinkList174").each(function() {
            var e = "<div class='widget-content'><h2>مواقع ندعمها</h2><ul><li>";
           $("#LinkList174 li").each(function() {
               var t = $(this).text(),
                   n = t.substr(0, 1),
                   r = t.substr(1);
    "+" == n ? (n = $(this).find("a").attr("href"), e += '<a href="' + n + '" target="_blank"><img height="125" width="125" src=' + r + "></img></a>") : (n = $(this).find("a").attr("href"), e += '</span></li><li><a href="' + n + '"><i class="fa fa-bullhorn" aria-hidden="true"></i>' + t + "<span>125x125</span></a>");
    });
           e += "</li></ul></div>";
           $(this).html(e);
           $("#LinkList174 ul").each(function() {
               var e = $(this);
               if (e.html().replace(/\s|&nbsp;/g, "").length == 0) e.remove()
           });
           $("#LinkList174 li").each(function() {
               var e = $(this);
               if (e.html().replace(/\s|&nbsp;/g, "").length == 0) e.remove()
           })
       });
    
                //]]>
                  </script>
                </div>
    <style type='text/css'>
    /*=====================================
    = widget banner-support
    =====================================*/
    div#LinkList174 li{width:50%;width:calc(100% / 2);height:auto;position:relative;overflow:hidden;margin:0;padding:0;display:inline-block;text-align:center;}
    div#LinkList174 li a{color:#757575;text-align:center;position:relative;overflow:hidden;margin:0 auto;padding:0;height:125px;width:125px;display:inline-block;font-size:13px;font-weight:700;background:#eeeeee;}
    div#LinkList174 li img{height:100%;width:100%;}
    div#LinkList174 li a i{text-align:center;display:block;font-size:17px;margin:10px auto 5px;width:35px;height:35px;line-height:35px;background-color:#4285f4;color:#ffffff;}
    div#LinkList174 li a span{position:relative;display:inline-block;font-size:12px;margin:10px auto;text-align:center;width:80px;background:#e4e4e4;}
    div#LinkList174 li a i{border-radius:100%;-o-border-radius:100%;-ms-border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;}
    div#LinkList174 li a{-webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transform:all 0.2s ease;-o-transform:all 0.2s ease;transition:all 0.2s ease;}
    div#LinkList174 li a{box-shadow:0 2px 7px 0 rgba(0,0,0,0.16);-webkit-box-shadow:0 2px 7px 0 rgba(0,0,0,0.16);-moz-box-shadow:0 2px 7px 0 rgba(0,0,0,0.16);-ms-box-shadow:0 2px 7px 0 rgba(0,0,0,0.16);-o-box-shadow:0 2px 7px 0 rgba(0,0,0,0.16);}
    div#LinkList174 li a:hover{box-shadow:5px 5px 10px 0 rgba(0,0,0,0.16);-webkit-box-shadow:5px 5px 10px 0 rgba(0,0,0,0.16);-moz-box-shadow:5px 5px 10px 0 rgba(0,0,0,0.16);-ms-box-shadow:5px 5px 10px 0 rgba(0,0,0,0.16);-o-box-shadow:5px 5px 10px 0 rgba(0,0,0,0.16);}
    </style>
               </b:includable>
                  </b:widget>

    تنويه .. في حالة واجهت خطأ More than one widget was found with id: LinkList174. Widget IDs should be unique. عند حفظ القالب يكون السبب أن معرف الأداة موجود مثله في القالب فقط إستبدل رقم المعرف LinkList174 بأي رقم غير موجود في الأدوات مثل LinkList165 أو LinkList154 مع العلم أن رقم المعرف LinkList174 مكرر أكثر من مرة في الأداة التي نقوم بتركيبها حاليا لذلك في حالة قمت بتغييره عليك بتغيير الجميع حتى تعمل الأداة بدون مشاكل.


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

الخطوة الأخيرة [تعديل الأداة]

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

  1. التعديل على الأداة 
  2. في مكان >> عنوان URL للموقع الجديد >> ضع علامة + ثم بعدها أضف رابط صورة المعلن
  3. في مكان >> اسم الموقع الجديد >> ضع رابط موقع المعلن