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

3/06/2014

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

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

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

سنأخذ بعض الاشكال في هذا الدرس البسيط وطريقة اضافتها في بلوجر :

اولا : اضافة ايقونات مواقع التواصل الاجتماعي بتأثير التدوير 360 درجة مثل الصورة التالية :

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

عن طريق الذهاب الى لوجة تحكم المدونة ومنها الى ← التخطيط ← اضافة اداة جديدة HTML/JavaScript

نضع هذا الكود

#social img {

-moz-transition: all 0.8s ease-in-out;

-webkit-transition: all 0.8s ease-in-out;

-o-transition: all 0.8s ease-in-out;

-ms-transition: all 0.8s ease-in-out;

transition: all 0.8s ease-in-out;

}

#social img:hover {

-moz-transform: rotate(360deg);

-webkit-transform: rotate(360deg);

-o-transform: rotate(360deg);

-ms-transform: rotate(360deg);

transform: rotate(360deg);

}

.comments .comments-content .icon.blog-author{position:absolute;top:-1px;right:-12px;margin:0;background-image: url(http://cdn2.iconfinder.com/data/icons/crystalproject/16x16/apps/keditbookmarks.png);width:36px;height:36px}

.CSS_LIGHTBOX_BG_MASK

{

background-color:#990000 !important;opacity: 0.8 !important;

}

.post img {max-width:95% !important;}

</style>

<br />

</center>

ثانياً : اضافة ايقونات مواقع التواصل الاجتماع على شكل الميترو مثل الصورة التالية :

طريقة التركيب وهي طريقة سهلة جدا :

نذهب إلى لوحة التحكم في بلوجر

ندخل إلى تخطيط

نختار المكان الذي سوف نضيف فيه الأداة ونضغط على إضافة أداة

نختار أداة HTML/JAVASCRIPT

ونضع هذا الكود :

<style>

#social {

margin:5px auto 0 auto;

text-align: center;

}

#social img {

margin-right: 2px;

margin-left: 0px;

width: 50px;

}

#social img:hover {

opacity: 0.6;

}

</style><br />

<div id="social">

<a href="#"><img alt="Twitter" src="http://img221.imageshack.us/img221/3171/twittericont.png" title="تابعنى على تويتر"></a><br />

<a href="#"><img alt="Feed" src="http://img521.imageshack.us/img521/3997/rssiconldl.png" title="الخلاصات"></a><br />

<a href="#"><img alt="Facebook" src="http://img707.imageshack.us/img707/5055/facebookiconq.png" title="تابعنى على الفيس بوك"></a><br />

<a href="#"><img alt="Google Plus" src="http://img9.imageshack.us/img9/6204/googleplusiconl.png" title="جوجل بلس"></a><br />

<a href="#"><img alt="Youtube" src="http://img835.imageshack.us/img835/1835/youtubeiconf.png" title="تابعنى على يوتيوب"></a><br />

<a href="http://www.7loll.blogger.com/"></a><br />

</div>

<div style="clear: both">

<br />

</div>

><br />

</a> </div>

</di <br>

ثم حفظ

ولا تنسوا إستبدال # بما يناسبك

ثالثاً : اضافة ايقونات مواقع التواصل الاجتماع على شكل شاحنات مثل الصورة التالية :

طريقة التركيب وهي طريقة سهلة جدا :

نذهب إلى لوحة التحكم في بلوجر

ندخل إلى تخطيط

نختار المكان الذي سوف نضيف فيه الأداة ونضغط على إضافة أداة

نختار أداة HTML/JAVASCRIPT

ونضع هذا الكود :

تم حفظ

انتهى

siege auto

التسميات

المشاركات الشائعة

مواقعنا

أرشيف المدونة

قسم 1

قوالب

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

شاركنا رأيك وكن اول من يقوم بالتعليق :)[ 0 ]

إرسال تعليق