![]() |
|
#1
|
|||
|
|||
|
اضافة اداة معلومات عن ملفك على تويتر
عندما يقدم زائر الى مدونتك , فإذا اعجبتة المدونة بالطبع يود الاشتراك بالمدونة باي طريقة كي يعود لها مرة أخرى واخرى , ولكن عندما لا يجد اداة الاشتراك بالمدونة اياً كانت , سواء كانت اداة الاعجاب بصفحة المدونة على الفيس بوك او اضافة متابعة لصفحة المدونة على قوقل بلس , او اضافة متابعة على تويتر , او اضافة الاشتراك عن طريق البريد الالكتروني , كلها أدوات مهمة , وتجعل الزوار يعودون لمدونتك ويزورونها مراراً , وفي أضافتنا اليوم , هي خاصة بحسابك على تويتر , حيث تعرض هذة الاضافة معلومات عن حسابك على تويتر , مثل : عدد التغريدات , وعدد المتابَعين , وعدد المُتابعِين صورة للاداة :. طريقة التركيب على المدونة :. # الخطوة 1 : أذهب الى لوحة تحكم بلوجر , ثم الى القالب , ثم الى تحرير HTML ثم أبحث عن ]]> والصق الكود التالي فوقها مباشرة /* -- Twitter Profile Box Gadget By ALa7mari--- */ .MBL-tweter-header { background: #1bc4de url(http://4.bp.blogspot.com/-IMtykEHZvy...ortolioa.png); } .MBL-tweter { width: 300px; background-color: #ffffff; font-family: Arial, Helvetica, sans-serif; -webkit-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.55); -moz-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.55); box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.55); border: 1px solid #e8e8e8; -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; border-radius: 8px; overflow:hidden; } .MBL-tweter .MBL-tweter-header { padding: 10px; height: 73px; } .MBL-tweter .MBL-tweter-header .screen-name h1 { color: #fff; margin: 0; font-size: 16px; text-transform: capitalize; font-family: 'Helvetica', sans-serif; } .MBL-tweter .MBL-tweter-header .screen-name h2, .MBL-tweter .MBL-tweter-header .screen-name h3 { color: #ffffff; margin: 0; font-size: 12px; font-family: 'Helvetica', sans-serif; } .MBL-tweter .MBL-tweter-header .screen-name { margin-top: 20px; width: 180px; float: right; } .MBL-tweter .MBL-tweter-header .profile-image { width: 73px; height: 73px; float: left; } .MBL-tweter .MBL-tweter-header .profile-image img { -webkit-border-radius: 10em; -moz-border-radius: 10em; border-radius: 10em; width: 73px; height: 73px; -webkit-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.55); -moz-box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.55); box-shadow: 0px 0px 5px rgba(50, 50, 50, 0.55); -moz-border-radius: 8px; -khtml-border-radius: 8px; } .MBL-tweter .twitter-summary { background-color: #f9f9f9; height: 60px; position: relative; } .MBL-tweter .twitter-summary ul { display: table-row; height: 60px; width: 100%; margin: 0; padding: 0; text-align: center; padding: 15px 0px; } .MBL-tweter .twitter-summary ul li { list-style-type: **ne; font-size: 12px; padding: 0px 6px 0px 6px; border-left: 1px solid #e8e8e8; text-align: center; vertical-align: middle; display: table-cell; color: #958470; *float: left; width: 84px; } .MBL-tweter .twitter-summary ul li a { color: #958470; text-decoration: **ne; } #boxs { clear: both; font-family: 'Helvetica', sans-serif; position: absolute; float: right; font-size: 10px; text-transform: uppercase; padding-left: 210px; margin-bottom: 20px; margin-top:10px; } #boxs a { text-decoration: **ne; color: #b0b0b0; } # الخطوة 2 : إذهب الى بلوجر , ثم الى التخطيط , ثم اضافة أداة وأختر اداة HTML/JavaScript وأضف الكود التالي بها , * أستبدا ما هو باللون الاحمر ( kh_ahmari ) بحسابك في تويتر وفي الختام نتمنى ان الاداة لم تكن صعبة وان يكون كل شيء واضح وشكر خاص للـ www.mybloggerlab.com |
|
|