0
A+ A-
قائمة جيده رائع لعرض خدماتك بشكل رائع وجميل وهذا القائمة كانت أستخدمها على مدونتى ولكنى الأن لا أستخدمها ولكننى أحبب أن أشاركها معكم اليوم هذا القائمة تمكنك من عرض عدد 8 خدمات كما هو فى المعاينة ويمكنك عرض عدد الخدمات الذى تريدها أذا كان لديك خبرة فى البرمجه ويمكنك معاينة القائمة من الرابط التالى نمر لشرح التركيب .


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


شرح التركيب


  1. اولا قم بالبحث عن هذا الوسم]]></b:skin>ثم وضع فوقه الكود التالى .


.wdbloogidebartabs .widget{border:0 none!important;box-shadow:0 0 0 1px #ddd inset}
.wdbloogidebartabs .widget h2{display:none}
#tabs-widget {overflow: hidden;float: right;width: 100%;display: inline-block;}
.tabs-widget li {float: right;list-style: outside none none;padding: 0;text-align: center;position: relative;z-index: 9;width: 49.8%;}
#wdbloogtab1 {padding-left: 20px;margin-right: 10px;}
#wdbloogtab1 a {background-color: #fff;}
#wdbloogtab1 a:hover , #wdbloogtab2 a:hover{background-color: #2896CA;color: #fff;}
#wdbloogtab2 {float: left;margin-left: 10px;width: 48.3%;}
.tabs-widget li a {color: #2896CA;display: block;line-height: 30px;text-transform: uppercase;font-weight: 500;height: 40px;width: 100%;box-shadow: 0 0 6px rgba(0,0,0,0.27);margin: 1px 0;background-color: #fff;}
.vc_services{float:right;width:255px;height:300px;padding: 15px;margin-left:10px;margin-right:10px;margin-bottom:20px;background-color:#fff;transition: all 250ms ease-in-out;box-shadow: 0 0 6px rgba(0,0,0,0.27);}
.wpb_wrapper img{width:100%;height:195px}
a.abdo-abd-alrazzaq {margin-top: -46px;display: block;float: right;position: relative;height: 40px;margin-right: 6px;}
img.abdo-abd-alrazzaq-a {border-radius: 50px;width: 50px;height: 50px;border: 3px solid #2896CA;}
.ish-services{text-align:center;margin-bottom:10px;font-weight:bold;padding:0 10px}
.ish-services a{font-weight:500;font-size: 16px;}
.ish-services a:hover{color:#2896CA}
.ish-b{font-weight:100;text-align:center;width:100%;float:right;padding:0 10px;font-size:13px}
.fa.fa-arrow-left:before {content: "\f060";font-size: 20px;line-height: 40px;}
i.fa.fa-arrow-right:before {content: "\f061";font-size: 20px;line-height: 40px;}


  1. الأن معك كود القائمة ويمكنك وضع فى المكان الذى تريدها


<div class='container'>
<div class='wdbloogidebartabs'>
<script type='text/javascript'>
jQuery(document).ready(function($){
$(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id&quot;).hide();
$(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li:first a&quot;).addClass(&quot;tabs-widget-current&quot;).show();
$(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id:first&quot;).show();
$(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li a&quot;).click(function() {
$(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li a&quot;).removeClass(&quot;tabs-widget-current a&quot;);
$(this).addClass(&quot;tabs-widget-current&quot;);
$(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id&quot;).hide();
var activeTab = $(this).attr(&quot;href&quot;);
$(activeTab).fadeIn();
return false;
});
});
</script>

<div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id1'>
           <div class='vc_services-s'>
            <div class='vc_services'>
              <div class='wpb_wrapper'>
              <a href='https://khamsat.com/programming/css-html/512087' target='_blank'>
               <img src='https://goo.gl/e5WIfs' title='تعديل وتطوير وحل مشاكل قوالب بلوجر باحترافية تامه'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/programming/css-html/512087' target='_blank'>
                    تعديل وتطوير وحل مشاكل قوالب بلوجر باحترافية تامه
                 </a> </h3>
                </a>
              </div>
            </div>
            <div class='vc_services'>
              <div class='wpb_wrapper'>
              <a href='https://khamsat.com/programming/css-html/512731' target='_blank'>
               <img src='https://goo.gl/nFvXo7' title='انشاء مدونة اجنبية اوعربية للربح منها + مواضيع حصريه'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/programming/css-html/512731' target='_blank'>
                    انشاء مدونة اجنبية او عربية للربح منها + مواضيع حصريه
                 </a> </h3>
                </a>
              </div>
            </div>
            <div class='vc_services'>
              <div class='wpb_wrapper'>
              <a href='https://khamsat.com/programming/css-html/519250' target='_blank'>
               <img src='https://goo.gl/LLgSro' title='جعل موقعك متجاوب مع جميع الهواتف واكسب المزيد من الزوار'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/programming/css-html/519250' target='_blank'>
                    جعل موقعك متجاوب مع جميع الهواتف واكسب الزوار
                  </a> </h3>
                </a>
              </div>
            </div>
            <div class='vc_services'>
              <div class='wpb_wrapper'>
              <a href='https://khamsat.com/marketing/advertising/512054' target='_blank'>
               <img src='https://goo.gl/7A7HLS' title='إعلان على مدونة عالم المدون'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/marketing/advertising/512054' target='_blank'>
                    إعلان على مدونة عالم المدون لتحقيق المزيد من الزوار
                 </a> </h3>
                </a>
              </div>
            </div>
          </div>
</div>                           
                               
<div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id2'>
           <div class='vc_services-s'>

            <div class='vc_services'>
              <div class='wpb_wrapper'>

              <a href='https://khamsat.com/misc/575542' target='_blank'>
               <img src='https://goo.gl/Kh2tFP' title='انشاء متجر الكترونى على بلوجر متكامل'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/misc/575542' target='_blank'>
                    انشاء متجر الكترونى على بلوجر متكامل لعرض عليه منتجاتك
                 </a> </h3>
                </a>
              </div>
            </div>

            <div class='vc_services'>
              <div class='wpb_wrapper'>
              <a href='https://khamsat.com/programming/css-html/568493' target='_blank'>
               <img src='https://goo.gl/0ZgxRD' title='تعريب قوالب بلوجر بإحترافيه تامة'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/programming/css-html/568493' target='_blank'>
                    تعريب قوالب بلوجر بإحترافيه تامة عبر خمسات
                 </a> </h3>
                </a>
              </div>
            </div>

            <div class='vc_services'>
              <div class='wpb_wrapper'>
              <a href='https://khamsat.com/marketing/advertising/583929' target='_blank'>
                <img src='https://goo.gl/7mFFU4' title='كتابة موضوع عن موقعك ونشره على موقعي'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/marketing/advertising/583929' target='_blank'>
                    كتابة موضوع عن موقعك ونشره على موقعي
                  </a> </h3>
                </a>
              </div>
            </div>

            <div class='vc_services'>
              <div class='wpb_wrapper'>
              <a href='https://khamsat.com/designing/526173' target='_blank'>
               <img src='https://goo.gl/TK5WyJ' title='إعلان على مدونة عالم المدون'/></a>
                <a>
                <a class='abdo-abd-alrazzaq' href='https://khamsat.com/user/abdo-abd-alrazzaq' target='_blank'>
               <img class='abdo-abd-alrazzaq-a' src='https://goo.gl/2E1jzS'/></a>
                  <h3 class='ish-services'><a href='https://khamsat.com/designing/526173' target='_blank'>      
اعرض شعارك بـ 20 طريقة فنية احترافية رائعة لتجعله بشكل مميز                                                                </a> </h3>
                </a>
              </div>
            </div>

          </div>
</div>                           
                               
<ul class='tabs-widget tabs-widget-widget-themater_tabs-1432447472-id ' id='tabs-widget'>
<li id='wdbloogtab1'><a href='#widget-themater_tabs-1432447472-id1'><i aria-hidden='true' class='fa fa-arrow-left'/></a></li>
<li id='wdbloogtab2'><a href='#widget-themater_tabs-1432447472-id2'><i aria-hidden='true' class='fa fa-arrow-right'/></a></li>
</ul>

</div>
</div>


  1. الأن عليك تغيير الروبط فى الكود كما تريدها 
  2. ايضا تغيير العناوين كما تريدها ايضا 
  3. وتقوم بحفظ القالب ومبروك عليك القائمة
  4. اذا وجهة مشكلة فى وضع الكود التانى 
  5. يمكنك وضع رابط مدونتك بتعليق لكي أخبروك بمكان وضع الكود


وهكذا كان موضوع اليوم بالتوفيق للجميع فى أمان الله

المصدر عالم المدون
Share to:

إرسال تعليق

جميع الردود تعبّر عن رأي كاتبيها فقط. حريّة النقد والرد متاحة لجميع الزوار بشرط أن لا يكون الرد خارج نطاق الموضوع وأن يكون خال من الكلمات البذيئة. تذكّر قول الله عز وجل (مَا يَلْفِظُ مِن قَوْلٍ إِلاَّ لَدَيْهِ رَقِيبٌ عَتِيد).

الاشتراك في: تعليقات الرسالة (Atom)
 
Top