أضافة قائمة الأشتراكات - فيس بوك - تويتر - اميل - RSS

السلام عليكم و رحمة الله و بركاته 

اليوم بنعرض ليكم اضافة رائعة و هى هاك للأشتراكات لبعض مواقع التواصل و هى اضافة رائعة جداً كما بالصورة التالية 

أولا ادخل الى واجهة مدوتك ثم اختار قائمة القالب اختار تعديل HTML ثم اضغط متابعة تم توسيع واجهة المستخدم 

أبحث عن الكود التالى ]]></b:skin>  ثم ضع هذا الكود فوقه مباشرة 

1. 
   

   @import url("http://fonts.googleapis.com/css?family=Oswald&text=AaBbCcEeFfIiKkLlMmOoRrSsTtWw%20");
   .w2bOldSocial ul {
   	font-family: 'Oswald', sans-serif;
   	margin: 15px 0;
   	overflow: hidden;
   }
   .w2bOldSocial ul li {
   	float: left;
   	width: 90px;
   	padding: 0 0 0 55px !important;
   	margin: 0 0 0 5px !important;
   	line-height: 48px !important;
   }
   .w2bOldSocial ul li a {
   	font-size: 20px !important;
   	text-decoration:none;
   	padding:0 !important;
   	margin:0 !important;
   	text-decoration:none;
   }
   .w2bOldSocial ul li a:hover {
   	text-decoration:underline;
   }
   .w2bOldSocial ul li.w2brss {
   	background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzTRKlUQeTHc3y2hYTlinBi7cx5C-5LTed_lGkqqHxurmxKpLsQ2SY71dqhEw-RAx8CyhmkO-hL5Nc27HFwuhBlCQeAat69o8eYI8ucb8zXx1mj9aq5CcuSQGVmosJpOT7tiVR8kjEcSNj/s48/RSS.png") no-repeat scroll left center transparent !important;
   }
   .w2bOldSocial ul li.w2bmail {
   	background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbOeiRwlm4icwGwDDDSOrJSYO0ilyV-aOJM-8l6rMfOvDItdbNbekbpdjWPpyUz5CtbHjj_bJ6hrAme-luSZGHxP0MfkUOucW-DDl6SpsWD3feOvuvgYUuzWBJp-rhtIhP6aRMmy88wssF/s48/Mail.png") no-repeat scroll left center transparent !important;
   }
   .w2bOldSocial ul li.w2btwitter {
   	background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiISW3MopvNvqCRGA_WZu2fAPnGEfu6P4no6yShXN3Tfxm-n9o8PDAJloRIStWGHtfR3Hu7-eUn77CKSCC56lMK6RvJw4Q1l2BRHpDGPe0dbTaQOeQA_YbRWwKZqTaGZo4Va3VRBLL_ZW0B/s48/Twitter2.png") no-repeat scroll left center transparent !important;
   }
   .w2bOldSocial ul li.w2bfacebook {
   	background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjocjLWEiYQuOHHLhhkBFzLz4wIKs-Innr5V5vlpCqj4oumqrTitf5oEHsEKYbK6Gbbf535GV6XuO9lH4lxr5lQ5sL7dRMM971GGsi8wgzK97yS_FJrpcBRGPMzJPLK0ujiu6WqqsYORi1C/s48/Facebook.png") no-repeat scroll left center transparent !important;
   }
   #w2bEmailsub {
   	display: block;
   	clear: both;
   	margin: 10px 0;
   }
   form.w2bEmailform {
   	margin: 20px 0 0;
   	display: block;
   	clear: both;
   }
   .emailText {
   	background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4U-7nCMz1pyoXyQxY8iiGqUnGn0DlWB8euGVjm6EwQ6KN-jAyAdMKPqW4Z0SrycXJpP2yA5-M4XeUvx2CtO9eQKnby0ktgeh3zBISueSq3adSnqCvjKtzxybqYYk3rfkr4EQVz29R29vy/s28/w2b-mail.png") no-repeat scroll 4px center transparent;
   	padding: 7px 15px 7px 35px;
   	color: #444;
   	font-weight: bold;
   	text-decoration: none;
   	border: 1px solid #D3D3D3;
   
   	-webkit-border-radius: 4px;
   	-moz-border-radius: 4px;
   	border-radius: 4px;
   
   	-webkit-box-shadow: 1px 1px 2px #CCC inset;
   	-moz-box-shadow: 1px 1px 2px #CCC inset;
   	box-shadow: 1px 1px 2px #CCC inset;
   }
   .emailButton {
   	color: #444;
   	font-weight: bold;
   	text-decoration: none;
   	padding: 6px 15px;
   	border: 1px solid #D3D3D3;
   	cursor: pointer;
   
   	-webkit-border-radius: 4px;
   	-moz-border-radius: 4px;
   	border-radius: 4px;
   
   	background: #fbfbfb;
   	background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
   	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
   	background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
   	background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
   	background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
   	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4',GradientType=0 );
   	background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
   }

ثم افتح قائمة التخطيط اختار اداة جديدة ثم اختار اداة HTML/JAVAScript

و انسخ فيها هذا الكود مع تعديل روابطك الخاصة

1. <div class="w2bOldSocial">
   	<ul>
   		<li class="w2brss"><a href="http://feeds.feedburner.com/amal-msr">RSS</a></li>
   		<li class="w2bmail"><a href="http://feedburner.google.com/fb/a/mailverify?uri=amal-msr" >Email</a></li>
   		<li class="w2btwitter"><a href="http://twitter.com/midoghranek">Twitter</a></li>
   		<li class="w2bfacebook"><a href="http://facebook.com/midoghranek">Facebook</a></li>
   	</ul>
   </div>
   <div id="w2bEmailsub">
   	<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=amal-msr', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="w2bEmailform">
   		<input type="hidden" value="amal-msr" name="uri" />
   		<input type="hidden" name="loc" value="en_US" />
   		<input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailText" />
   		<input type="submit" class="emailButton" value="SignUp" title='' />
   	</form>
   </div>