- fahad
- 8:52 م
- أضافات ودروس بلوجر ، الشبكات الاجتماعية
- 4 تعليقات
بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
أقدم لكم اليوم أضافة بسيط وجميلة في نفس الوقت وهي أزرار المتابعة في الشبكات الأجتماعية لمدونات البلوجر والتي تكون في الشريط الجانبي أي القائمة الجانبية
الأيقونات جميلة المظهر وأنيقة فعند وضع مؤشر الماوس على أحد الايقونات
تبرز بشكل أكبر ألى الأمام
للمعاينة قم بوضع المؤشر فوق أحدا الأيقونات
السلام عليكم ورحمة الله وبركاته
أقدم لكم اليوم أضافة بسيط وجميلة في نفس الوقت وهي أزرار المتابعة في الشبكات الأجتماعية لمدونات البلوجر والتي تكون في الشريط الجانبي أي القائمة الجانبية
الأيقونات جميلة المظهر وأنيقة فعند وضع مؤشر الماوس على أحد الايقونات
تبرز بشكل أكبر ألى الأمام
للمعاينة قم بوضع المؤشر فوق أحدا الأيقونات
طريقة تركيب ألاضافة
توجه للوحة التحكم الخاصة بمدونتك
تصميم
أضافة أداة
وأختار منها الجافا هتمل
أضف الكود التالي داخل الصندوق المخصص لذلك
<style>
#main_cbt_icons {
width:222px;
height:37px;
}
#facebook {
width:37px;
height:37px;
float:right;
margin:0px;
padding:1px 1px 1px 1px;
}
#twitter {
width:37px;
height:37px;
float:right;
margin:0px;
padding:1px 1px 1px 1px;
}
#google_plus {
width:37px;
height:37px;
float:right;
margin:0px;
padding:1px 1px 1px 1px;
}
#rss {
width:37px;
height:37px;
float:right;
margin:0px;
padding:1px 1px 1px 1px;
}
#youtube {
width:37px;
height:37px;
float:right;
margin:0px;
padding:1px 1px 1px 1px;
}
img:hover {
-webkit-transform: scale(1.1) skewX(2deg) skewY(2deg);
-webkit-transform-origin: 0% 0%;
-moz-transform: scale(1.1) skewX(2deg) skewY(2deg);
-moz-transform-origin: 0% 0%;
-o-transform: scale(1.1) skewX(2deg) skewY(2deg);
-o-transform-origin: 0% 0%;
-ms-transform: scale(1.1) skewX(2deg) skewY(2deg);
-ms-transform-origin: 0% 0%;
transform: scale(1.1) skewX(2deg) skewY(2deg);
transform-origin: 0% 0%;
}
</style>
<div id="main_cbt_icons">
<div id="facebook">
<a href="http://www.facebook.com/mdonti-n.blogspot.com/" target="_blank" title="تابعنا على الفيسبوك"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvPM3kHinUyfK4rdT36-U8XgrM9eU0Wyglg2nGSCDjVIWbcy9JNKUn04CykDdjKXRmag8DyDSabnBuyYx_7ogYudakKRM4G7sTcTPc0kJXkBdp1OmUzW5da6dO75EV9eTFvmoldcLcAzo/s1600/social-facebook-box-white-icon.png" /></a>
</div>
<div id="twitter">
<a href="http://www.twitter.com/mdonti-n.blogspot.com" target="_blank" title="تابعنا على تويتر"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLhvhfVBnKteA1AnS2FAbSl1fZ25_nkTaMKzgOCeDAAfADnJfuifGutGOGMiXHTIkFASLEbkmdQchQnt1_L1lKLA9xYeChSzCnRwn3bObInhxPmX-yZyxFz2vPaTzWDUBYA7_FubDoR3I/s1600/social-twitter-box-white-icon.png" /></a>
</div>
<div id="google_plus">
<a href="https://plus.google.com/mdonti-n.blogspot.com/" target="_blank" title="تابعنا على قوقل بلس"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeG1M4Tb_FGNXg42Jq_gHoFfdy81lj0iaJff1fvvBhRtKQkSIZocBenYWjc2dwQQdYM0pN0xLcgS3cMJoXaIMGsqoLcZPV6gmQLREZ4uxwg44AmKBmV_j3a8Q-0T0LjYzQsnia_lQA7Ss/s1600/social-google-box-white-icon.png" /></a>
</div>
<div id="rss">
<a href="http://feedburner.google.com/fb/a/mailverify?uri=mdonti-n.blogspot.com/&loc=en_US" target="_blank" title="أشتراك بتغذية المدونة"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEj-fS4_Z5CaEwoIE4O_J8IuQHGQJUlUmsKPvbp2CqEYaZmHSZKB9x5711mm1HA2QcKQ61QMsEACPOiYNEVRVrYWVWH1XHl2jO5REMTE8jgi86kgNzfGxj7o8lumukcF5pub_NKN-YtI8/s1600/social-rss-box-white-icon.png" /></a>
</div>
<div id="youtube">
<a href="http://www.youtube.com/mdonti-n.blogspot.com/" target="_blank" title="شاهد الفيديو"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4cjiKUjknzhWHLXhYrnrQUq3cDHe4Qq1NQbfm9re6pMAQf2tW8ghOrP3RYYVakc8OH-Szr8kL0KL5B9DLWW7oLAO8VLAgFuSPWIiES3VC9OYr-K6BgvM8Vh7_kdCId8_p0wTK1P5rZzY/s1600/YouTube-icon+%25281%2529.png" /></a>
</div>
</div>
مع أستبدال كل ما أشير له في الكود بلون الأحمر بصفحات مدونتك في الفيسبوك وتويتر وقوقل بلس ويوتيوب وكذلك رابط التغذية
وسلام عليكم ورحمة الله وبركاته
أضافة رائعة جدا
ردحذفواصل عطائك
أتمنى لك التوفيق
أهلا بك أخي
ردحذفتشرفت بمرورك وتعليقك بارك الله فيك
شرح واضح من شخص مبدع .. بارك الله فيك
ردحذفشكراا جاري التحميل
ردحذف