رئيسية المعهد
رئيسية المعهد  تواصل معنا  حقوق الملكية الفكرية  اربط مدونتك بنا  محول أكواد أدسنس

 

معرض قوالب معهد خبراء بلوجر - دليل مدونات بلوجر - موقع نشر بلوجر - اضافات بلوجر




العودة   معهد خبراء بلوجر > الدعم الفني > إضافات وأدوات بلوجر


إضافة رد
نسخ الرابط
نسخ للمنتديات
 
أدوات الموضوع انواع عرض الموضوع
قديم 08-31-2012, 07:55 PM   #1
Ridamag
مدون جديد
 
تاريخ التسجيل: Aug 2012
المشاركات: 33
افتراضي اضافة ازرار المشاركة الاجتماعية بتقنية css3 مطورة من مدونة رضا لبلوجر

أنا : Ridamag




لمشاهدة الموضوع بشكل افضل في المدونة: هنا

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

+ كما اسلفت الذكر، لقد اجريت العديد من التعديلات لتظهر بهذا الشكل :)
+ كان بالنسخة السابقة العديد من المشاكل التي و في الغالب هي التي منعتكم من استخدامها، و اهمها :
  • شكل بسيط جدا و غير مميز.
  • ايقونات ذات جودة متوسطة.
  • غياب Google Plus.
  • و المشكل الاكثر اهمية، ان بعد الضغط على ايقونة موقع اجتماعي ما لم يكن تفتح في نافذة جديدة.
- المعاينة ؟، يمكنك مشاهدتها في اسفل التدوينة :)، كما ان هذه هي صورة لكيف تبدو ( في حالة استبدلتها ) :

+ لكنني و بعون الله، وبعض البحث، حللت كل المشاكل، جعلتها تبدو اجمل بكثير، كما تمت اضافة Google Plus، تم تغيير الايقونات لايقونات اخرى افضل جودة و اخف في التحميل، وتم حل المشكل الاكثر اهمية و هو انه بعد الضغط على ايقونة اي موقع اجتماعي، تفتح نافذة صغيرة لتستطيع مشاركتها دون مشاكل :) .

- لكن السؤال يبقى، من اين احصل عليها ؟
+ ستحصل عليها من هذه الصفحة، والان باذن الله، فقط تابع الشرح.
- اولا اذهب الى لوحة التحكم، ثم الى قالب، ثم احفظ نسخة من القالب، ثم الى تحرير HTML:
- ثم حدد توسيع قوالب عناصر واجهة المستخدم.
- ثم ابحث عن هذا الكود :
كود بلغة HTML:
</head>
- لتصلق قبله الكود اسفله :
كود:
<style type='text/css'>
    /* Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org & Modified By Rida @ www.ridasail.blogspot.com */
    ul.social { -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: url(&quot;http://i.imgur.com/uoKjU.png&quot;) no-repeat scroll 3px 1px #202020;
    border-color: #000000 #333333 #333333 #000000;
    border-radius: 6px 6px 6px 6px;
    border-style: solid;
    border-width: 1px;
    display: inline-block;
    line-height: 18px;
    list-style-position: outside;
    list-style-type: none;
    margin: 10px 10px 0 0;
    padding-bottom: 10px;
    padding-left: 110px;
    padding-right: 10px;
    padding-top: 9px;}
  ul.social { list-style:none; margin:1px auto;display:inline-block; }
ul.social li { display:inline; float:left; background-repeat:no-repeat; }
ul.social li a { display:block; width:48px; height:48px; padding-right:5px; position:relative; text-decoration:none; }
ul.social li a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff;padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0,0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0,0.5);}
ul.social li.facebook { background-image:url(&quot;https://lh3.googleusercontent.com/-Go0YEGKKgRM/UECkQ_4X85I/AAAAAAAAAfs/LwoktCldbwU/s48/facebook.png&quot;); }
ul.social li.twitter { background-image:url(&quot;https://lh4.googleusercontent.com/-ZiKWE_BV9fQ/UECkSbkOj4I/AAAAAAAAAgI/TdmRTY-ece8/s48/twitter.png&quot;); }  
ul.social li.googlebuzz { background-image:url(&quot;https://lh3.googleusercontent.com/-leSwB-HHao0/UECkRdLxSCI/AAAAAAAAAfk/j-8ILcwc8gQ/s48/google%252B.png&quot;); }
ul.social li.stumbleupon { background-image:url(&quot;https://lh3.googleusercontent.com/-oNCLXQh8zXk/UECkR0-fNEI/AAAAAAAAAf4/O0xiqTLJ1Po/s48/stumbleupon.png&quot;); }
ul.social li.digg { background-image:url(&quot;https://lh3.googleusercontent.com/-N4T3Gv1SGDo/UECkQ_7TO4I/AAAAAAAAAfo/kzrzqCxsCR0/s48/digg.png&quot;); }
ul.social li.delicious { background-image:url(&quot;https://lh6.googleusercontent.com/-Jck0zYd-Ep8/UECkQ1nGnsI/AAAAAAAAAfc/IzF5rA5BaTE/s48/delicious.png&quot;); }
ul.social li.linkedin { background-image:url(&quot;https://lh6.googleusercontent.com/-tSk0GtFoMeU/UECkRwX6HkI/AAAAAAAAAf8/vrFSmj0nEXs/s48/linkedin.png&quot;); }
ul.social li.reddit { background-image:url(&quot;https://lh4.googleusercontent.com/-Q6rNe7_LjA0/UECkRyCgiMI/AAAAAAAAAgA/zJ5nobNhYR4/s48/reddit.png&quot;); }
ul.social li.technorati { background-image:url(&quot;https://lh4.googleusercontent.com/-D6m-H54D9Lg/UECkSROmY3I/AAAAAAAAAgQ/OJ55CLwW1_s/s48/technorati.png&quot;); }
#cssanime:hover li { opacity:0.2; }
#cssanime li { -webkit-transition-property: opacity; -webkit-transition-duration: 500ms;-moz-transition-property: opacity; -moz-transition-duration: 500ms; }
#cssanime li a strong { opacity:0; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; }
#cssanime li:hover { opacity:1; }
#cssanime li:hover a strong { opacity:1; top:-10px; }
    /* Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org & Modified By Rida @ www.ridasail.blogspot.com */
    </style>
- الان ابحث عن هذا الكود :
كود:
<data:post.body/>
- ثم الصق بعده هذا الكود مباشرة :
كود:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<ul class='social' id='cssanime'>
<li class='facebook'>
<a expr:href='&quot;http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title 'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Share this on Facebook'><strong>Facebook</strong></a>
</li>
<li class='twitter'>
<a expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot; -- &quot; + data:post.url 'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false; ' rel='nofollow' title='Tweet This!'><strong>Twitter</strong></a>
</li>
<li class='googlebuzz'>
<a expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url + &quot;&amp;imageurl=&quot;'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Post on GoogleBuzz'><strong>Google Plus</strong></a>
</li>
<li class='stumbleupon'>
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title 'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'><strong>StumbleUpon</strong></a>
</li>
<li class='digg'>
<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title 'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Digg this!'><strong>Digg</strong></a>
</li>
<li class='delicious'>
<a expr:href='&quot;http://delicious.com/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title 'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Share this on del.icio.us'><strong>Delicious</strong></a>
</li>
<li class='linkedin'>
<a expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;summary=&amp;source=&quot;'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Share this on LinkedIn'><strong>LinkedIn</strong></a>
</li>
<li class='reddit'>
<a expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title 'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Share this on Reddit'><strong>Reddit</strong></a>
</li>
<li class='technorati'>
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url 'onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' title='Share this on Technorati'><strong>Technorati</strong></a>
</li>
</ul>
</b:if>
- لتكون قد انتهيت، اتمنى ان تعمل بشكل جيد كما اشتغلت لدي.
شكرا لمروركم الرائع و الى اللقاء :) .

لمشاهدة الموضوع بشكل افضل في المدونة: هنا

الدعم العربي

Ridamag غير متواجد حالياً   رد مع اقتباس

مركز رفع موسوعة العربية
قديم 08-31-2012, 08:29 PM   #2
admin
مدير عام
 
الصورة الرمزية admin
 
تاريخ التسجيل: Apr 2012
الدولة: جده
المشاركات: 2,846
افتراضي رد: اضافة ازرار المشاركة الاجتماعية بتقنية css3 مطورة من مدونة رضا لبلوجر

أنا : admin




إضافة جميلة أخي رضا
وتمت معاينتها لك مني
طمعا في المزيد من خبراتك

الدعم العربي

admin غير متواجد حالياً   رد مع اقتباس
قديم 08-31-2012, 08:44 PM   #3
Ridamag
مدون جديد
 
تاريخ التسجيل: Aug 2012
المشاركات: 33
افتراضي رد: اضافة ازرار المشاركة الاجتماعية بتقنية css3 مطورة من مدونة رضا لبلوجر

أنا : Ridamag




شكرا لك اخي عثمان

الدعم العربي

Ridamag غير متواجد حالياً   رد مع اقتباس
إضافة رد

مواقع النشر (المفضلة)

الكلمات الدلالية (Tags)
المشاركة, الاجتماعية, ازرار, اضافة, بتقنية


الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1)
 
أدوات الموضوع
انواع عرض الموضوع

تعليمات المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة

الانتقال السريع

المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
اضافة جميع ازرار المواقع الاجتماعية في مدونتك saheralialy إضافات وأدوات بلوجر 8 06-25-2013 06:08 AM
كود اضافة ازرار المواقع الإجتماعية في مدونة بلوجر بتقنية css3 ilyass kéng إضافات وأدوات بلوجر 0 01-31-2013 05:02 PM
اضافة اقرء المزيد بتقنية css3 لمدونات بلوجر بلال حمدان إضافات وأدوات بلوجر 0 01-23-2013 02:29 PM
طلب ازرار المشاركة الاجتماعية princess of egypt طلبات الدعم الفني 2 09-24-2012 06:28 PM
اضافة ازرار الموقع الاجتماعية بتقنية css4 mostafa alwin إضافات وأدوات بلوجر 3 07-09-2012 04:18 PM





لتصفح أفضل وللاستفادة القصوى من خصائص المعهد ننصحكم باستعمال :

Powered by vBulletin® Copyright ©2000 - 2024 Dov By EGYNT.Co
new notification by 9adq_ala7sas
Developed By Marco Mamdouh
معهد خبراء بلوجر - 2012 Google
أعلن على المعهد : اتصل بنا - منتدي كنوز - الدعم العربي - قوالب بلوجر - او او انيمي
رئيسية المعهد
الساعة الآن 10:37 AM - بتوقيت جرينتش
المعهد غير مسؤول عن أي اتفاق تجاري أو تعاوني بين الأعضاء
فعلى كل شخص تحمل مسؤولية نفسه تجاه ما يقوم به من بيع وشراء وإتفاق وإعطاء معلومات مدونته
التعليقات المنشورة لا تعبر عن رأي معهد خبراء البلوجر ولا نتحمل أي مسؤولية قانونية حيال ذلك
(ويتحمل كاتبها مسؤولية النشر)