[ جديد ] شكل جذاب تعريف كاتب الموضوع لمدونة بلوجر
من جديد مع بعضنا وفي سلسلة الأبداعات ننطلق , شكل جديد ومختلف لتعريف كاتب الموضوع او " عن الكاتب " لمدونة بلوجر .من مزايا هذا الشكل انه يمكنك استخدامه في استخدامين :
ان تضعه اسفل التدوينة .
ان تضعه في صفحة مستقله , وتقوم بتكراره على حسب عدد الكتاب في مدونتك " واحد , اثنان .. الخ " .
مثال حي : من هنا
طريقة تركيب كاتب الموضوع لمدونة بلوجر :
اذا اردت وضعه في صفحة مستقله فقم فقط بنسخ هذه الاكواد ولصقها :
<div class='blog1-7lolblogger-com'>
<p>معلومات عن العضو</p>
<div id='blogg-7lolblogger-com'>
<a href='#'><img src='https://jetara.googlecode.com/files/4032-66.jpg'/></a>
</div>
<img src="https://jetara.googlecode.com/files/stars-5.png"/>
<div id='blogger-7lolblogger-com'>
<span>تاريخ الميلاد : 1992/10/2</span>
<span>المهنه : مدونة محترف</span>
<span>الأسم الحقيقي : عبدالله الحربي</span>
<span>الدولة : المملكة العربيه السعودية </span>
<span>صاحب مدونة</span><a href=''>حلول بلوجر</a>
<div id='blog-ksa-7lolblogger-com'><p>وسائل التوصل معه : </p>
<a href='#'><img src='https://jetara.googlecode.com/files/facebook232311.png'/></a>
<a href='#'><img src='https://jetara.googlecode.com/files/twitter131.png'/></a>
<a href='#'><img src='https://jetara.googlecode.com/files/youtube1455.png'/></a>
<a href='#'><img src='https://jetara.googlecode.com/files/rss1314.png'/></a>
</div>
</div>
</div>
<style>
.blog1-7lolblogger-com {
background: #F3F3F3;
border: 1px solid #DDD;
max-width: 650px;
width: 600px;
padding: 10px;
border-radius: 5px;
margin: 0 auto;
text-align: right;
direction: rtl;
text-shadow: none;
height: 250px;
}
.blog1-7lolblogger-com p {
float: right;
background: #F0F0F0;
border: 1px solid #DDD;
padding: 3px;
border-radius: 5px 5px 5px 0;
margin: 0;
font: 700 15px arial,tahoma;
color: #1177B1;
text-shadow: 1px 1px #FFF;
width: 200px;
}
#blogg-7lolblogger-com {
float: right;
clear: both;
margin: 0;
width: 200px;
padding: 5px 3px 0 0;
height: 230px;
border-left: 5px solid #DDD;
}
#blogger-7lolblogger-com {
float: right;
width: 360px;
margin: 0 20px 0 0;
font: 13px tahoma,arial;
color: #333;
line-height: 20px;
padding: 0;
}
#blogger-7lolblogger-com span {
float: right;
clear: both;
text-shadow: 1px 1px #FFF;
}
#blogger-7lolblogger-com p {
float: right;
width: 90%;
margin: 20px 0 0 0;
padding: 3px;
}
#blogger-7lolblogger-com a {
float: right;
font: 700 12px tahoma,arial;
color: #007AFF;
text-decoration: none;
border-right: 1px dotted #999;
border-left: 1px dotted #999;
margin: 0 10px;
padding: 0 5px;
}
#blog-ksa-7lolblogger-com a {
border: 0 !important;
margin: 0 !important;
padding: 5 !important;
}
#blog-ksa-7lolblogger-com a img {
border-radius: 10px;
}
</style>
التعديلات :
صورة كاتب الموضوع يجب ان يكون حجمها 180PX 200PX.
تقيم العضو او الكاتب.
تاريخ الميلاد.
المهنه او اي ماتريد .
اسمك.
بلدك.
مدونتك.
رابط صفحتك في فيسبوك.
رابط صفحتك في تويتر.
رابط صفحتك في اليوتيب.
رابط خلاصة مدونتك .
إرسال تعليق