نعود ثانية للحذيث عن إضافات بلوجر وهذه المرة قمت بتعريب وتعديل إضافة مميزة جدا خصيصا لكم متتبعي وزوار مدونة موسوعة بلوجر وهي عبارة عن صندوق إشتراك متتبعي المدونة ولكن ما يميزه هو أنه يجمع بين أداة الإشتراك عبر مواقع التواصل الإجتماعي كالفيسبوك مثلا وأيضا صندوق الإشتراك في القائمة البريدية أي التسجيل عبر الإميل.
وللتعرف أكثر على شكل الأداة ومشاهدتها مباشرة :
طريقة التركيب :
قم بالدخول إلى لوحة تحكم مدونتك ثم إلى التخطيط ثم إضافة أداة وبعد ذلك إبحث عن أداة Html/Javascript وقم بنسخ الكود التالي في الصندوق الفارغ و لا تضع عنوانا للإضافة :
<!--هذه الأداة مقدمة من طرف موسوعة بلوجر-->
<style>
body {
color: #434343;
font: 14px/20px Arial,Helvetica,sans-serif;
}
#sidebar .widget {
background-color: #F5F5F5;
margin: 15px 0;
padding: 4px;
position: relative;
}
#sidebar .widget .head {
text-shadow: 0 1px 0 #FFFFFF;
}
#sidebar .widget .box {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 8px;
}
#sidebar .widget .box-out {
background-color: #FFFFFF;
border-bottom: 1px solid #E5E5E5;
padding: 1px;
}
.clearfix:after {
clear: both;
content: " ";
display: block;
font-size: 18;
height: 18;
line-height: 12;
visibility: hidden;
width: 18;
}
#sidebar .widget .box {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 8px;
}
.clearfix {
display: block;
}
.clearfix {
display: inline-block;
}
.clearfix:after {
clear: both;
content: " ";
display: block;
font-size: 0;
height: 0;
line-height: 0;
visibility: hidden;
width: 0;
}
.email_rss {
border-bottom: 1px solid #E5E5E5;
margin-bottom: 5px;
position: relative;
}
.social_links, .email_rss {
padding: 5px 0 10px;
width: 100%;
}
.clearfix {
display: block;
}
.fan_box {
background-color: #F5F5F5;
margin: 15px 0;
padding: 4px;
position: relative;
}
.fan_box .full_widget {
background-color: #FFFFFF;
border: 1px solid #E5E5E5;
}
.fan_box .full_widget .connect_top {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 8px;
}
.fan_box .full_widget .connections {
background-color: #FFFFFF;
border-bottom: 1px solid #E5E5E5;
padding: 5px 1px 1px;
}
.fan_box .full_widget .connections_grid {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 6px;
}
.fan_box .full_widget .connections .total {
margin: 4px 0 4px 8px;
}
.fan_box .profileimage {
background-color: #FFFFFF;
border: 1px solid #E5E5E5;
display: inline;
margin-right: 10px;
padding: 5px;
}
.fan_box .full_widget .connections_grid a img {
border: 1px solid #FFFFFF;
}
.fan_box .full_widget .connections_grid a img:hover {
border: 1px solid #000000;
}
.social_links, .email_rss {
padding: 5px 0 10px;
width: 100%;
}
.social_links a {
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUZblLXKN2ZFI6uiO0H-WVSAF1qZSfY7Tv2Avy66fIEW8ndXHZCKna9yQ3FfW_BUt76Tiz9bm8DC2WviEWyz06yyArxXT1ySlX8_nZneqtJKJvu-tG9H6LEMg3n-RA7HElsel5w404MR4/s1600/social.png");
background-repeat: no-repeat;
color: #999999;
display: inline;
float: left;
font-size: 11px;
margin-bottom: 0;
padding-top: 45px;
text-align: center;
text-decoration: none;
width: 67px;
}
.social_links a:hover {
color: #000000;
text-decoration: underline;
}
a#side_fb {
background-position: -173px 0;
}
a#side_tw {
background-position: -81px 0;
}
a#side_rss {
background-position: 8px 0;
}
a#side_email {
background-position: -267px 0;
}
#geek {
background: url("4.bp.blogspot.com/-JJL5i3WAtEA/UDip4G3DxhI/AAAAAAAAF7A/fa1vmnxMt38/s1600/social.png") no-repeat scroll -387px -363px transparent;
bottom: -1px;
display: block;
height: 117px;
position: absolute;
right: -22px;
text-indent: -9999em;
width: 94px;
}
.email_rss {
border-bottom: 1px solid #E5E5E5;
margin-bottom: 5px;
position: relative;
}
.email_rss span {
font-size: 11px;
}
#subscribe-form {
margin-top: 5px;
}
#subscribe-form #newsletter {
border: 1px solid #CCCCCC;
padding: 5px;
width: 150px;
}
#subscribe-form #newsletter:focus {
background-color: #F5F2D3;
border: 1px solid #000000;
}
#subscribe-form .btn {
background-color: #7EB4CF;
border: 1px solid #2F6A89;
box-shadow: 3px 3px 0 #6DA5C1 inset, -3px -3px 0 #6DA5C1 inset;
color: #FFFFFF;
cursor: pointer;
display: inline;
float: right;
font-size: 12px;
font-weight: 900;
line-height: 12px;
padding: 5px 8px;
position: relative;
text-shadow: 0 1px 0 #000000;
z-index: 999;
}
#subscribe-form .btn:hover {
background-color: #4E9CC4;
}
#subscribe-form span {
background-color: #F5F5F5;
display: inline;
float: left;
margin-right: 10px;
padding: 3px;
}
h3 {
font-family: MgOpenModata;
font-weight: 400;
}
#sidebar .widget .head p {
color: #999999;
font-size: 11px;
line-height: 15px;
padding: 0;
}
</style>
<div id="counter" class="widget">
<div class="inner clearfix">
<div class="box-out">
<div class="head box">
<h3>تابعنا</h3>
<center>
<p>تسجل الآن في قائمتنا البريدية لتتوصل بكل جديد</p>
</center> </div>
</div>
<div class="side_cont box-out clearfix">
<div class="box clearfix">
<div class="email_rss clearfix">
<center> <span>أدخل بريدك الإلكتروني ليصلك كل جديد بالمدونه ومتابعتنا بكل سهوله ولا تنسي تفعيل الاشتراك من خلال صندوق الوارد بالبريد.</span> </center>
<form id="subscribe-form" class="clearfix" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri='ency-bl', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input id="newsletter" class="txt" type="text" name="email"/><input type="hidden" value="bloggingehow" name="uri"/><input type="hidden" name="loc" value="en_US"/><input class="btn" type="submit" value="تسجل الآن" /></form>
</div>
<div class="social_links clearfix">
<a id="side_fb" class="png_bg dysocial" rel="nofollow" title="إنضم إلى معجبينا على الفيسبوك" href="www.facebook.com/encybl" >الفيسبوك</a>
<a id="side_tw" class="png_bg dysocial" rel="nofollow" title="تابعنا على تويتر" href="www.twitter.com/encybl" >تويتر</a>
<a id="side_rss" class="png_bg dysocial" rel="nofollow" title="إشترك بخلاصات المدونة" href="www.ency-bl.com/feeds/posts/default" >الخلاصات</a>
<a id="side_email" class="png_bg dysocial" rel="nofollow" title="تابعناعبر الإميل" href="http://feeds.feedburner.com/ency-bl">الإميل</a>
</div>
<span style=" line-height:0px; font-size:8px; font-weight:bold; margin-left:290px;
">
<a style="color:#D3D3D3;" href="http://www.ency-bl.com">موسوعة بلوجر</a></span>
</div>
</div>
</div>
</div>
<style>
body {
color: #434343;
font: 14px/20px Arial,Helvetica,sans-serif;
}
#sidebar .widget {
background-color: #F5F5F5;
margin: 15px 0;
padding: 4px;
position: relative;
}
#sidebar .widget .head {
text-shadow: 0 1px 0 #FFFFFF;
}
#sidebar .widget .box {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 8px;
}
#sidebar .widget .box-out {
background-color: #FFFFFF;
border-bottom: 1px solid #E5E5E5;
padding: 1px;
}
.clearfix:after {
clear: both;
content: " ";
display: block;
font-size: 18;
height: 18;
line-height: 12;
visibility: hidden;
width: 18;
}
#sidebar .widget .box {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 8px;
}
.clearfix {
display: block;
}
.clearfix {
display: inline-block;
}
.clearfix:after {
clear: both;
content: " ";
display: block;
font-size: 0;
height: 0;
line-height: 0;
visibility: hidden;
width: 0;
}
.email_rss {
border-bottom: 1px solid #E5E5E5;
margin-bottom: 5px;
position: relative;
}
.social_links, .email_rss {
padding: 5px 0 10px;
width: 100%;
}
.clearfix {
display: block;
}
.fan_box {
background-color: #F5F5F5;
margin: 15px 0;
padding: 4px;
position: relative;
}
.fan_box .full_widget {
background-color: #FFFFFF;
border: 1px solid #E5E5E5;
}
.fan_box .full_widget .connect_top {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 8px;
}
.fan_box .full_widget .connections {
background-color: #FFFFFF;
border-bottom: 1px solid #E5E5E5;
padding: 5px 1px 1px;
}
.fan_box .full_widget .connections_grid {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdq7cAV9L14F2E-kv8JBC0inyfqQTanrd1EJck-dDFTiRCMVOI-ubGg2FlpNRlptCoSx_zk89iayGWoLl4fqSTHCi4kXAeNCR7rxd7v1P2dx0q0r3Y1zX5YqACMswDkaJ-1B2FkYVDDT0/s1600/sidebar_bg.png") repeat-x scroll left bottom transparent;
padding: 6px;
}
.fan_box .full_widget .connections .total {
margin: 4px 0 4px 8px;
}
.fan_box .profileimage {
background-color: #FFFFFF;
border: 1px solid #E5E5E5;
display: inline;
margin-right: 10px;
padding: 5px;
}
.fan_box .full_widget .connections_grid a img {
border: 1px solid #FFFFFF;
}
.fan_box .full_widget .connections_grid a img:hover {
border: 1px solid #000000;
}
.social_links, .email_rss {
padding: 5px 0 10px;
width: 100%;
}
.social_links a {
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUZblLXKN2ZFI6uiO0H-WVSAF1qZSfY7Tv2Avy66fIEW8ndXHZCKna9yQ3FfW_BUt76Tiz9bm8DC2WviEWyz06yyArxXT1ySlX8_nZneqtJKJvu-tG9H6LEMg3n-RA7HElsel5w404MR4/s1600/social.png");
background-repeat: no-repeat;
color: #999999;
display: inline;
float: left;
font-size: 11px;
margin-bottom: 0;
padding-top: 45px;
text-align: center;
text-decoration: none;
width: 67px;
}
.social_links a:hover {
color: #000000;
text-decoration: underline;
}
a#side_fb {
background-position: -173px 0;
}
a#side_tw {
background-position: -81px 0;
}
a#side_rss {
background-position: 8px 0;
}
a#side_email {
background-position: -267px 0;
}
#geek {
background: url("4.bp.blogspot.com/-JJL5i3WAtEA/UDip4G3DxhI/AAAAAAAAF7A/fa1vmnxMt38/s1600/social.png") no-repeat scroll -387px -363px transparent;
bottom: -1px;
display: block;
height: 117px;
position: absolute;
right: -22px;
text-indent: -9999em;
width: 94px;
}
.email_rss {
border-bottom: 1px solid #E5E5E5;
margin-bottom: 5px;
position: relative;
}
.email_rss span {
font-size: 11px;
}
#subscribe-form {
margin-top: 5px;
}
#subscribe-form #newsletter {
border: 1px solid #CCCCCC;
padding: 5px;
width: 150px;
}
#subscribe-form #newsletter:focus {
background-color: #F5F2D3;
border: 1px solid #000000;
}
#subscribe-form .btn {
background-color: #7EB4CF;
border: 1px solid #2F6A89;
box-shadow: 3px 3px 0 #6DA5C1 inset, -3px -3px 0 #6DA5C1 inset;
color: #FFFFFF;
cursor: pointer;
display: inline;
float: right;
font-size: 12px;
font-weight: 900;
line-height: 12px;
padding: 5px 8px;
position: relative;
text-shadow: 0 1px 0 #000000;
z-index: 999;
}
#subscribe-form .btn:hover {
background-color: #4E9CC4;
}
#subscribe-form span {
background-color: #F5F5F5;
display: inline;
float: left;
margin-right: 10px;
padding: 3px;
}
h3 {
font-family: MgOpenModata;
font-weight: 400;
}
#sidebar .widget .head p {
color: #999999;
font-size: 11px;
line-height: 15px;
padding: 0;
}
</style>
<div id="counter" class="widget">
<div class="inner clearfix">
<div class="box-out">
<div class="head box">
<h3>تابعنا</h3>
<center>
<p>تسجل الآن في قائمتنا البريدية لتتوصل بكل جديد</p>
</center> </div>
</div>
<div class="side_cont box-out clearfix">
<div class="box clearfix">
<div class="email_rss clearfix">
<center> <span>أدخل بريدك الإلكتروني ليصلك كل جديد بالمدونه ومتابعتنا بكل سهوله ولا تنسي تفعيل الاشتراك من خلال صندوق الوارد بالبريد.</span> </center>
<form id="subscribe-form" class="clearfix" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri='ency-bl', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input id="newsletter" class="txt" type="text" name="email"/><input type="hidden" value="bloggingehow" name="uri"/><input type="hidden" name="loc" value="en_US"/><input class="btn" type="submit" value="تسجل الآن" /></form>
</div>
<div class="social_links clearfix">
<a id="side_fb" class="png_bg dysocial" rel="nofollow" title="إنضم إلى معجبينا على الفيسبوك" href="www.facebook.com/encybl" >الفيسبوك</a>
<a id="side_tw" class="png_bg dysocial" rel="nofollow" title="تابعنا على تويتر" href="www.twitter.com/encybl" >تويتر</a>
<a id="side_rss" class="png_bg dysocial" rel="nofollow" title="إشترك بخلاصات المدونة" href="www.ency-bl.com/feeds/posts/default" >الخلاصات</a>
<a id="side_email" class="png_bg dysocial" rel="nofollow" title="تابعناعبر الإميل" href="http://feeds.feedburner.com/ency-bl">الإميل</a>
</div>
<span style=" line-height:0px; font-size:8px; font-weight:bold; margin-left:290px;
">
<a style="color:#D3D3D3;" href="http://www.ency-bl.com">موسوعة بلوجر</a></span>
</div>
</div>
</div>
</div>
التغييرات التي يجب القيام بها :
1. يمكنك تغيير عنوان الأداة بما تراه مناسبا <h3>تابعنا</h3>
2. يجب تغيير الروابط التالية بما يناسب :
www.ency-bl.com/feeds/posts/default رابط خلاصات المدونة
http://feeds.feedburner.com/ency-bl رابط التسجيل بالفيدبرنر
http://feeds.feedburner.com/ency-bl رابط التسجيل بالفيدبرنر
www.facebook.com/encybl رابط صفحة المدونة على الفيسبوك
www.twitter.com/encybl رابط المدونة على تويتر
3. يمكنك تغيير العبارات الموجودة بالأداة بما تراه مناسبا
خاتمة :
على العموم أتمنى أن تعجبكم الإضافة وإلى موضوع قادم بإذن الله.
بقلم رشيد إدعلي
مؤسس مدونة موسوعة بلوجر ،شاب مغربي طموح محب للتدوين و التقنية بشكل عام يسعى إلى الإرتقاء بالمحتوى العربي، طرق التواصل معي إما من خلال موقع التواصل الإجتماعي فيسبوك أو من خلال البريد الإلكتروني : rachidox2@gmail.com
هل حقا إستمتعت بهذه التدوينة ؟
إذن أدخل بريدك الإلكتروني لتتوصل بجديد المواضيع
9 comments:
تدوينة رائعة و مفيدة شكرا
رائع يا أخي
شكرا لكما إخواني على المرور الطيب
أنا محتاج مساعدتك في لتحسين مدونتي يا أخي محتاج الاستفاده من أفكارك أرجو التواصل أنا بعتلك طلب صداقه ع الفيس
يسعدنى أن تكون من زوار مدونتى أساحبى كوميكس
www.asa7becomecs.blogspot.com
بارك الله فيكـ طريقة سهلة ورائعة
شكرا لك اخي الكريم
اخي الكريم لو تكرمت اريد كود الموجود حاليا
رائع و مفيد
إرسال تعليق