تـعـريف بـ الكـاتـب لـمدونـات بـلـوجـر بـشـكـل أحـتـرافـي 2014

<div><div align="center">






أهلآ سنتطرف إليكم طريقة جديدة لوضع كاتب الموضوع
في نهاية المواضيع في بلوجر
ولكن هذي المره مختلفة جدآ وطريقة تركيبها لاتاخذ جهد
بل طريقة تركيبها سهله جدآ
وبمقابل شكل أحترافي جدآ مع ايقونات التواصل وبأضافة الاشتراك عبر البريد الاكتروني

انصح بها بشدة

طريقة تركيب

اذهب الى لوحة تحكم بلوجر / القالب / تحرير القالب
أبحث عن

]]>


وضع الكود التالي قبلها مباشرآ

@font-face { font-family: 'JF-Flat-regular'; src: url('https://alinaeliq-cssfile.googlecode...lar.eot'); src: url('https://alinaeliq-cssfile.googlecode...ular.eot?') format('embedded-opentype'), url('https://alinaeliq-cssfile.googlecode...ular.woff') format('woff'), url('https://alinaeliq-cssfile.googlecode...gular.ttf') format('truetype');}
.postauthor {
background: #f8f8f8;
border: 1px solid #3598DB;
padding: 10px;
overflow: hidden;
margin: 4px 0px -7px 0px;
}
.postauthor img {
float: right;
background: #fff;
margin: 0 0 0 8px;
padding: 4px;
border: 1px solid #E0E0E0;
border-radius: 3px;
}
.postauthor h4 {
font: normal 14px JF-Flat-regular;
color: #3D5272;
background: url(http://2.bp.blogspot.com/-OHcYNHmyqi...s1600/user.png) no-repeat 84% 50%;
padding: 0 125px 0;
}
.postauthor a {
color: #5DA86C;
font-size: 14px;
padding-right: 2px;
}
.postauthor p {
font: normal 13px JF-Flat-regular;
color: #34495e;
line-height: 2em;
text-shadow: 0 1px 0 #fff;
}
/*----------social postauthor------------*/
#social_postauthor {
margin: 16px 0 0;
overflow: hidden;
background: #fff;
padding: 4px;
border-radius: 3px;
border: 1px solid #ddd;
}
#social_postauthor ul{margin:0;padding:0;overflow:hidden;}
#social_postauthor ul li {
float: right;
padding: 0;
margin: 3px 2px;
border-radius: 2px;
transition: 0.5s;
}
#social_postauthor ul li a{
display: inline-block;
float: right;
font-size: 0;
height: 30px;
line-height: 0;
text-indent: -9999em;
width: 30px;
transition:0.5s;
}
#social_postauthor ul li:hover{
transform:rotate(360deg);
-ms-transform:rotate(360deg); /* IE 9 */
-webkit-transform:rotate(360deg); /* Safari and Chrome */
-moz-transform:rotate(360deg); /* Safari and Chrome */
-o-transform:rotate(360deg); /* Safari and Chrome */
transition:0.5s;
}
#social_postauthor ul li span{
font: normal 13px JF-Flat-regular;
text-shadow: 0 1px 0 #fff;
padding: 4px 4px 4px 4px;
}
#social_postauthor .txt {
padding: 4px 0;
}
#social_postauthor .fb {
background: url(http://1.bp.blogspot.com/-TAJGG5Ms9D...M/s1600/fb.png) no-repeat 50% center;
background-color: #003366;
}
#social_postauthor .tw {
background: url(http://2.bp.blogspot.com/-Upn2CKa8jz...Y/s1600/tw.png) no-repeat 50% center;
background-color: #0ba6f7;
}
#social_postauthor .gl {
background: url(http://2.bp.blogspot.com/-iZ2UMC49GF...d8/s1600/g.png) no-repeat 50% center;
background-color: #dc311b;
}
.subspabox {
background: #f8f8f8 url(http://4.bp.blogspot.com/-iNt1NmiazT...contact-gr.png) no-repeat 98% 50%;
font-family: JF-Flat-regular;
color: #293949;
margin: 0;
width: 62%;
text-align: right;
padding: 4px 25px 6px 0;
border: 1px solid #ddd;
border-radius: 3px;
float: left;
}

ثم أبحث عن
<div class='post-footer'>




أو



وضع الكود التالي بعدها مباشرآ




الكاتب :







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

• 
  
  تواصل معي :
  
• 
  
  fb
  
• 
  
  tw
  
• 
  
  gl
  
  
  
  

انتهينا واتمنى ان الكل استفاد :)

المصدر دريم نت

تعريف بكاتب بشكل احترافي جدآ مع اشتراك ببريد لمدونات بلوجر وبتركيب سهل ~ دريم نت | لخدمات الويب


































أكثر...