خريجي التدوين: اضافة ازرار المشاركة الاجتماعية بتقنية CSS3 مطورة لبلوجر

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

- المعاينة ؟، يمكنك مشاهدتها في اسفل التدوينة :)، كما ان هذه هي صورة لكيف تبدو ( في حالة استبدلتها ) :

لكن السؤال يبقى، من اين احصل عليها ؟

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

</head>

- لتصلق قبله الكود :

<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>

- الان ابحث عن هذا الكود :

<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>

- لتكون قد انتهيت، اتمنى ان تعمل بشكل جيد كما اشتغلت لدي.

... نهاية الشرح ...

هل أعجبك الموضوع ؟

اضافة ازرار المشاركة الاجتماعية بتقنية CSS3 مطورة لبلوجر

لكن السؤال يبقى، من اين احصل عليها ؟

... نهاية الشرح ...

ليست هناك تعليقات:

الاقسام

إشترك في القائمة البريدية

ضع إيميلك ليصلك كل جديد المحترف

اضافة ازرار المشاركة الاجتماعية بتقنية CSS3 مطورة لبلوجر

لكن السؤال يبقى، من اين احصل عليها ؟

... نهاية الشرح ...

قد يهمك أيضا : قسم إنشاء المواقع وتطويرها

ليست هناك تعليقات:

الاقسام

إشترك في القائمة البريدية

ضع إيميلك ليصلك كل جديد المحترف

قد يهمك أيضا :
قسم إنشاء المواقع وتطويرها