JavaScript is not enabled!...Please enable javascript in your browser

جافا سكريبت غير ممكن! ... الرجاء تفعيل الجافا سكريبت في متصفحك.

اضافة صناديق الاشتراك اسفل الموضوع في بلوجر

اضافة صناديق الاشتراك اسفل الموضوع في بلوجر

#اضافات بلوجر
0
(0)
author-img
نجم تهامه
اضافة صناديق المشاركة في مواقع التواصل الاجتماعي من اهم الاضافات لمدونات بلوجر

اليوم في موضوع جديد و اضافة جديدة و هي عبارة عن صناديق الاشتراك في مواقع التواصل الاجتماعي مثل فيس بوك و تويتر و جوجل بلس و الاضافة تظهر اسفل المواضيع في مدونات بلوجر و ما يميز هذه الاضافة انها متوافقة مع جميع الشاشات و اجهزة المحمول    شاهد المثال التالي لتتعرف اكثر :


طريقة التركيب

ابحث عن <data:post.body/> و اضف الكود التالي تحته
<b:if cond='data:blog.pageType == "item"'>
<link href='https://googledrive.com/host/0B3omcK7jIprqRm95VVpQZDJHRzQ' rel='stylesheet'/>
<div class="wpr">
        <a class="social" id="twitter" href="www.twitter.com/mudwnp" title="تويتر">
            <div class="icon"></div>
           
            <div class="shutter_frame">
                <div class="shutter">
                    <div class="number">1189</div>
                    <div class="bar"></div>
                    <div class="text">تابعنا</div>
                </div>
            </div>
        </a>
       
        <a class="social" id="google" href="https://plus.google.com/u/0/+mudwnpro" title="جوجل بلس">
            <div class="icon"></div>
           
            <div class="shutter_frame">
                <div class="shutter">
                    <div class="number">421</div>
                    <div class="bar"></div>
                    <div class="text">+1</div>
                </div>
            </div>
        </a>
       
        <a class="social" id="facebook" href="https://www.facebook.com/mudwnp" title="فيس بوك">
            <div class="icon"></div>
           
            <div class="shutter_frame">
                <div class="shutter">
                    <div class="number">973</div>
                    <div class="bar"></div>
                    <div class="text">اعجبني</div>
                </div>
            </div><!-- / .shutter_frame -->
        </a>
    </div><!-- / .wpr -->
</b:if>

اهم الملاحظات حول الكود


استبدل ما هو باللون الاحمر بروابط حساباتك على مواقع التواصل الاجتماعي
استبدل الارقام التي باللون الازرق بما يناسبك
استبدل الكلمات التي باللون البرتقالي بما يناسبك


الان ابحث عن الوسم </body> و اضف الكود التالي فوقه
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js' type='text/javascript'/>
    <script src='//cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js'/>
    <script>
        $(document).ready(function() {
       
            $('.social').hover(
                function() {
                    $(this).find('.shutter').stop(true, true).animate({
                        bottom: '-36px'
                     },
                     {
                         duration: 300,
                         easing: 'easeOutBounce'
                     });
                },
                function () {
                    $(this).find('.shutter').stop(true, true).animate({
                        bottom: 0
                     },
                     {
                         duration: 300,
                         easing: 'easeOutBounce'
                     });
                }
            );
           
        });
    </script>



الكود الاحمر يمكنك ازالته ان كان لديك مكتبة جي كويري في القالب

يمكنك ايضا مشاهدة : اضافة صناديق المشاركة و الإعجاب اسفل مواضيع بلوجر
                            اضافة ازرار التواصل الاجتماعي في الشريط الجانبي
                            اضافة ازرار مشاركة مواقع التواصل الاجتماعي الاحترافية 2014

بالتوفيق

NomE-mailMessage

Rechercher dans ce blog
"0" title="Advertisement" aria-label="Advertisement" style="border: none; height: 300px; width: 600px; margin: 0px; padding: 0px; position: relative; visibility: visible; background-color: transparent; display: inline-block; overflow: visible;">
google-playkhamsatmostaqltradent