6 اكواد لـ نبذه عن صاحب المدونه بالصور About blogger

مشاهدات الان السلام عليكم

مجموعه طيبه من اكواد وبرمجه خفيفه لـ نبذه عن صاحب المدونه

البحث
]]></b:skin>
ضع الكود فوقه

.authorbio {
background-color: #F8F8F8;
margin-bottom: 20px;
margin-top: 30px;
padding: 20px 10px;
}
.authorbio img {
border: 3px solid #eee;
float: right;
height: 125px;
margin: 0 0 0 10px;
outline: 1px solid #ddd;
width: 125px;
}
.authorbio h6 {
display: inline-block;
margin: 0;
font-size: 17px;
margin-bottom: 8px;
}
.authorbio h6 strong {
color: #3cafe0;
font-size: 17px;
}
.authorbio span {
color: #666;
display: block;
font: 16px/2em tahoma;
margin: 0;
}

ابحث عن
<div class='post-footer'>
ضعه تحته هذا الثاني

<b:if cond='data:blog.pageType == "item"'>
<div class='authorbio'>
<imgsrc='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBn0npbTYx5D8kYSYH82D9ttgF3qFcz7ScQZayssJ_UsWLX8L0sbbUYm_bMBvFAqFwoySj1Sozo_Lwb-raQOmWiHomtKQytUnPOieDZck4jXW1yQH_egz93YZGmzfj1Js4CpvtF1ZJT2pT/s223-Ic42/blank_user.jpg'/>
<h6>صاحب المدونه : <strong>اخوكم هإأيف إألكويت </strong></h6>
<span>راح تجد كل ما تبحث عنه من عالم الانترنت ومواضيع محليه وشخصيه ومعلومات العالم فقط شاركنا</span>
<div style='clear: both;'/>
</div>
</b:if>

البحث عن
]]></b:skin>
فوقه

.swt-author {
background-color: aliceblue;
font-weight: bold;
border-top: 1px solid #321;
border-left: 2px solid #000;
border-right: 2px solid #000;
border-bottom: 1px solid #123;
overflow: auto;
}
.swt-author name {
display: inline-block;
font-size: 15px;
float: left;
text-align: center;
margin: 5px;
white-space: nowrap;
}
.swt-author name a {
font-style: italic;
color: #fff;
background-color: #000;
padding: 12px;
padding-top: 1px;
padding-bottom: 2px;

البحث عن
<div class='post-header-line-1'>
الثاني تحته

<div class='swt-author'><name> Author
<a expr:href='data:post.authorProfileUrl' rel='author' title='authorprofile'><span itemprop='name'><data:post.author/>
</span></a>
</name></div>

وهذا

.swt-author {
background-color: aliceblue ;
font-weight: bold;
border-top: 1px solid #321;
border-left: 2px solid #000;
border-right: 2px solid #000;
border-bottom: 1px solid #123;
overflow: auto;
}
.swt-author profile {
font-family:"Times New Roman", Times, serif;
font-weight: normal;
padding:5px 0;
margin:0;
text-transform:auto;
line-height:24px;
word-wrap:break-word;
}
.swt-author profile info {
font-size: 18px;
text-align: justify;
font-family: 'Droid Serif', serif;
}
.swt-author profile img {
float: left;
margin: 5px;
width:125px;
border: 2px solid #666;
border-radius:25px;
opacity:0.4;
filter:alpha(opacity=40);
transition:width 1s, height 1s, transform 1s;
-webkit-transition:width 1s, height 1s, -webkit-transform 1s;
}
.swt-author profile img:hover {
border-radius:5px;
opacity:1.0;
filter:alpha(opacity=100);
transform:rotate(360deg);
-webkit-transform:rotate(360deg);

وهذا متحرك

.swt-author {
margin: 1em 0;padding: .5em .25em;
background-color: #f1f4f8;
border: 5px solid #192a3e;
border-style: groove;
overflow: auto;
-webkit-transition:all .4s ease-in-out;
-moz-transition:all .4s ease-in-out;
-ms-transition:all .4s ease-in-out;
-o-transition:all .4s ease-in-out;
transition:all .4s ease-in-out;
}
.swt-author:hover {
color:#ffffff;background-color: #192a3e;
border: 5px solid #1ABC9C;
border-style: outset;
-webkit-transition:all .4s ease-in-out;
-moz-transition:all .4s ease-in-out;
-ms-transition:all .4s ease-in-out;
-o-transition:all .4s ease-in-out;
transition:all .4s ease-in-out;
}
.swt-author:hover img {
border: 2px solid #1ABC9C;
border-radius:100px;
opacity:0.8;
filter:alpha(opacity=80);
-webkit-transition:all .4s ease-in-out;
-moz-transition:all .4s ease-in-out;
-ms-transition:all .4s ease-in-out;
-o-transition:all .4s ease-in-out;
transition:all .4s ease-in-out;
}
.swt-author profile {
font-family:"Times New Roman", Times, serif;
font-weight: normal;
padding:5px 0;
margin:0;
text-transform:auto;
line-height:24px;
word-wrap:break-word;
}
.swt-author profile info {
font-size: 24px;
text-align: justify;
font-family: 'Droid Serif', serif;
}
.swt-author profile img {
float: left;
margin: 5px;
width:100px;
border: 2px solid #192a3e;
border-radius:50px 0;
opacity:1.0;
filter:alpha(opacity=100);
-webkit-transition:all .5s ease-in-out;
-moz-transition:all .5s ease-in-out;
-ms-transition:all .5s ease-in-out;
-o-transition:all .5s ease-in-out;
transition:all .5s ease-in-out;

والبحث عن
<div class='post-footer-linepost-footer-line-1'>
تحت الثاني

<b:if cond='data:blog.pageType == "item"'>
<div class='swt-author'>
<b><u>نبذه عن المدونه : </u></b>
<profile>
<img alt='author'src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4erD-5n2Ca3Bc2zd9Z0yYOMxcqf00XAieiUdNGc9O12DYVDcZsiEaNeR3v90sQQuHwyPqPMG1q2K3203JLUMAS8yB6pTv8MLidGvlEeEJz9VMWs4rOPvhapDau0qkqr0NFdGYTwV8UgCi/s600-Ic42/kuwait_hayef-Hacked-by.gif'/>
<info> حياكم الله في مدونتي البسيطه صفحات هايف <i><ahref='#'>المزيد</a></i>...</info>
</br><hr>
<a href='replace it with youtube profile url'>اليوتيوب</a> |
<a href=' replace it with Facebook profile url'>الفيس بوكس</a> |
<a href=' replace it with Twitter profile url'>التويتر</a>
</profile></div>
</b:if>

البحث عن
]]></b:skin>
فوقه حط

@font-face { font-family: 'JF-Flat-regular'; src:url('https://alinaeliq-cssfile.googlecode.com/svn/trunk/jfflatfont/JF-Flat-regular.eot');src:url('https://alinaeliq-cssfile.googlecode.com/svn/trunk/jfflatfont/JF-Flat-regular.eot?')format('embedded-opentype'),url('https://alinaeliq-cssfile.googlecode.com/svn/trunk/jfflatfont/JF-Flat-regular.woff')format('woff'),url('https://alinaeliq-cssfile.googlecode.com/svn/trunk/jfflatfont/JF-Flat-regular.ttf')format('truetype');}
.postauthor {
background: #f8f8f8;
border: 1px solid #e74c3c;
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 20px JF-Flat-regular;
font-weight: bold;
color: #3D5272;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHNZjGkW3Iepty9Lxwc91LREjBYE7dYkUcSy3AQAfv-ahHN7xr6MWvpFRtmk0qa4410ErFX86h5olnDcOBjhODF_RWSVCM6PDyDNDIEQJNYz7751W540RU4BMnf8KzHL1tKa5-_NrCVvpj/s1600/user.png)no-repeat 84% 50%;
padding: 0 125px 0;
}
.postauthor a {
color: #5DA86C;
font-size: 20px;
padding-right: 2px;
}
.postauthor p {
font: normal 13px tahoma;
color: #34495e;
line-height: 2em;
text-shadow: 0 1px 0 #fff;
font-weight: bold;
}
#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);
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-o-transform:rotate(360deg);
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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhBu6In4vjyCs55BOhNVKYS6sdoooj_VjiIc0AlXDrZ5dcX63YnrnOOcgmP4ay0i4PyC0MhWXTNxmbosCLw6rOJGICLlDAT_F5fkH2NF0aF1TOmIcrBGIHIkV_MGhZec5-gcnJn3uAjsA/s1600/fb.png)no-repeat 50% center;
background-color: #003366;
}
#social_postauthor .tw {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVu7XrhqGUBdizEquz0LkwXK36OjR4s1nSUkMxMNl7xjuqpK990VYgK9TossiMDGypUglS5tC7GJTMKDyoju1lpyWBUogr98PWc4rxVB_5hDf3gIjcevrdcwqCk7SJdWeTMSF0M20Tpss/s1600/tw.png)no-repeat 50% center;
background-color: #0ba6f7;
}
#social_postauthor .gl {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRug-oHRBPP5ryGBp5xJh6Aizha7tIf0VIcMCx23-jjQyDeKkMiKnCveLeHNIZZRhpJpF5J1JWrPXsDpJG45R9yFT5Q7Zn0ArHsOJ4NtRm2uJKgtPgnQtR-muATwmhguKW-3fwtiNssj4/s1600/g.png)no-repeat 50% center;
background-color: #dc311b;
}
#social_postauthor .yt {
background:url(https://cdn1.iconfinder.com/data/icons/flat-3d-social-media-icons/48/youtube.png)no-repeat 50% center;
background-color: #dc311b;
}
.subspabox {
background: #f8f8f8url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi49U5WBklJYuAZUsfd21nHpnL-mgDr15xq8zEvH8bisJV2dA48ID2Rp_F2cX2ydob0IvxhJLq2QWFb9lw3f-Fl4Ifl8BOaz47Gaj_dD4MDxnzIJv-9Sy0M5UJKL7yX1rkE1txgzh5ooFU/s1600/contact-gr.png)no-repeat 98% 50%;
font-family: JF-Flat-regular;
color: #293949;
margin: 0;
width: 55%;
text-align: right;
padding: 4px 25px 6px 0;
border: 1px solid #ddd;
border-radius: 3px;
float: right;
}

وتبحث عن
<div class='post-footer-line post-footer-line-1'>
او
<div class='post-footer'>
ونفس الشرح اخر واحد حطه تحته

<div class='postauthor'>
<img height='114' rel='author'src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYo08BL8VcDBPH4gJZ9Fe-zIvLln5P3tDanDyF-P0TyptBGMyerQlukyQNvmYq3j7uXu1HjnefxbK0P_L_E78MrYZ5nmRh6H_zEw8CPKDmDX1ipWXiWVjjPXQIj6Uez7i8ZbGeOEWdW0E/s1600/Closed-3ajmi-saefrenie.gif' width='112'/>
<h4>
الكاتب :
<a href='http://algme3-kw.blogspot.com/' target='_blank'>
<data:post.author/>
</a>
</h4>
<p>وصف مختصر عن الكاتب </p>
<div class='rw-js-container'/>
<div id='social_postauthor'>
<ul>
<li class='txt'>
<span>
تواصل معي :
</span>
</li>
<li class='fb'>
<a href='#' rel='nofollow' target='_blank'>
fb
</a>
</li>
<li class='tw'>
<a href='#' rel='nofollow' target='_blank'>
tw
</a>
</li>
<li class='gl'>
<a href='#' rel='nofollow' target='_blank'>
gl
</a>
</li>
<li class='yt'>
<a href='#' rel='nofollow' target='_blank'>
yt
</a>
</li>
<form action='http://feeds.feedburner.com/blogspot/wQKqV'id='subspa' method='post'onsubmit='window.open('http://feeds.feedburner.com/blogspot/wQKqV;,'popupwindow','scrollbars=yes,width=550,height=520');return true'target='popupwindow'>
<input class='subspabox' onblur='if (this.value == ""){this.value = "او ضع اميلك هنا حتى يصلك كل المواضيع برسائل...";}' onfocus='if (this.value == "او ضع اميلك هناحتى يصلك كل المواضيع برسائل...") {this.value = "";}'type='text' value='او ضع اميلك هنا حتى يصلك كل المواضيع برسائل...'/>
</form>
</ul>
</div>
</div>

البحث عن
</b:skin>
فوقه

#author-box{margin:10px 0;}
#author-box a:hover{background:none!important;}
#author-box .row-1{background:#333;padding:20px;}
#author-box .row-1.avatar{float:right;line-height:1;-moz-box-shadow:0 0 10px#FFF;-webkit-box-shadow:0 0 10px #FFF;box-shadow:0 0 10px #FFF;}
#author-box .row-1 .info{margin:0 110px 0 0;}
#author-box .row-1 .info h6{color:#FFF;font-size:20px;margin:-4px 00;}
#author-box .row-1 .info h6span{font-size:11px;font-weight:400;background:#1BA1E2;-webkit-border-radius:40px;-moz-border-radius:40px;border-radius:40px;filter:alpha(opacity=60);opacity:0.6;margin:01em 0 0;padding:1px 9px 2px;}
#author-box .row-1 .infop{color:#DDD;font-weight:400;font-size:14px;margin:0;}
#author-box .row-2 {background:#666;}
#author-box .row-2a.social-item{display:block;float:right;color:#FFF;text-align:center;padding:15px;}
#author-box .row-2 .social-item .icon{height:32px;width:32px;}
#author-box .row-2 .social-item >span{display:block;text-align:center;margin:auto;}
#author-box .row-2 .social-item.label{font-weight:700;font-size:13px;}
#author-box .row-2a.social-item:hover{background:#1BA1E2!important;}
#author-box .row-2 .social-item.twitter .icon{background-position:0-32px;}
#author-box .row-2 .social-item.facebook .icon{background-position:0-64px;}
#author-box .row-2 .social-item.gplus .icon{background-position:0-96px;}
#author-box .row-2 .social-item.linkedin .icon{background-position:0-128px;}
#author-box .row-2 .social-item.youtube .icon{background-position:0-160px;}
#author-box .row-2 .social-item.pinterest.icon{background-position:0 -192px;}
#author-box .social-item.icon{background-image:url(https://lh5.googleusercontent.com/--PQVoN23nrI/UYHHvhtNSxI/AAAAAAAAJPA/5weO87qvER4/s224/ausocial.png)!important;background-repeat:no-repeat;}

الان اعد البحث عن الكود التالي
<div class='post-footer'>
بعد عثورك عليه ضع الكود التالي اسفله.

<div id='author-box'><div class='row row-1'><div class='avatar'>
<a href='http://xxxxx.blogspot.com/'>
<img alt='author-avatar' class='avatar avatar-90 photo' height='90'src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBn0npbTYx5D8kYSYH82D9ttgF3qFcz7ScQZayssJ_UsWLX8L0sbbUYm_bMBvFAqFwoySj1Sozo_Lwb-raQOmWiHomtKQytUnPOieDZck4jXW1yQH_egz93YZGmzfj1Js4CpvtF1ZJT2pT/s223-Ic42/blank_user.jpg'width='90'/>
</a></div><div class='info'><h6><span>هنا تكتب اسمك</span></h6>
<p><strong>حياكم الله في مدونتي البسيطه</strong>
<strong> صفحات هايف</strong>
</p></div><div class='clear'/></div>
<div class='row row-2'>
<a class='social-item website' href='https://xxxxx.blogspot.com/'meta='website' target='_blank'>
<span class='icon'/><span class='label'>الموقع</span></a>
<a class='social-item twitter' href='https://xxxxx.blogspot.com'meta='twitter' target='_blank'>
<span class='icon'/><span class='label'>التويتر</span></a>
<a class='social-item facebook' href='https://xxxxx.blogspot.com'meta='face' target='_blank'>
<span class='icon'/><span class='label'>الفيسبوك</span></a>
<a class='social-item gplus' href='https://xxxxx.blogspot.com'meta='gplus' target='_blank'>
<span class='icon'/><span class='label'>جوجل +</span></a>
<a class='social-item linkedin' href='https://xxxxx.blogspot.com'meta='linkedin' target='_blank'>
<span class='icon'/><span class='label'>لينكدين</span></a>
<a class='social-item youtube' href='https://xxxxx.blogspot.com'meta='youtube' target='_blank'>
<span class='icon'/><span class='label'>يوتيوب</span></a>
<div class='clear'/></div></div>

البحث عن
]]></b:skin>
فوقه حط

.postauthor {
background: #F5F5F5;
border-top: 1px solid #e1e1e0;
border-bottom: 1px solid #e1e1e0;
overflow: hidden;
padding: 0.7em;
}
.postauthor img {
border: 5px solid #e2dede;
float: right;
margin-left: 1em;
}
.postauthor h3 {
color: #666;
font-size: 1.2em;
margin-bottom: 5px;
margin-top: 0;
}
.postauthor p {
color: #515151;
font-size: 12px;
margin-bottom: 10px;
margin-top: 0;
}

البحث عن
<data:post.body/>
وجدت ثنتين فالثانية هي المقصودة) ثم مباشرة بعدها ضع الكود الآتي تحته
[او بتحديد تحت ]
<b:if cond='data:blog.pageType =="static_page"'><data:post.body/></b:if>
وتعيده مرتين : تنبيه هذا التطبيق على قوالب المدونه الاصلي فقط وغيرالمعربه او من تصميم شخصي ملخبط " واذا وجدت واحد او اثنين اضف تحته

<b:if cond='data:blog.pageType == "item"'>
<div class='postauthor'>
<img alt='' height='80'src='http://ser1.almlf.com/i/00016/r63hwfye8uou.png' width='80'/>
<h3>بقلم <a href='Blog Link'> اسم الكاتب </a></h3>
<p> هايف السفراني : يسميكم بالخير ويصبحكم بالخير - kuwaiT </p>
</div>
</b:if>

البحث عن
]]></b:skin>
فوقه

.author-nak1ha h3 span{ color:#465769;}
.author-nak1ha h3{ color: #fff; font-size: 23px;
font-weight: 100;}
.author-nak1ha p{color: #fff}
.author-nak1ha img{ width: 100px;
height: 100px;
text-align: center;
border: 2px solid #ffffff;
border-radius: 90px;
position: absolute;
right: 0;
left: 0;
top: -50px;
margin: auto;}
.author-nak1ha{
border:1px solid #2a4057;
border-left: 0;
text-align: center;
position: relative;
border-right: 0;
padding: 20px 0;
background: rgb(36, 55, 80)url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgusMIZel4U3u0p46ggg6Il1sBvU053lbnUre2YVxgyYlW1-hOTzPA4xqTYpbD7Xip0W-PbhipdsPVRoL5llKuDyo3qtNW-vcHz0fG0599hXujs40J4ro1EAltFHVXRDH4rBGxGryF7S8Q/s1600/Nature_Persian-Star.png);
padding-top: 64px;
color: #fff;
margin: 42px auto;
margin-bottom: 12PX;
width: 100%;
}
.author-nak1ha a {
color: #fff;
}

البحث عن
</body>
فوقه
او البحث
<div class='post-footer'>
تحته

<b:if cond='data:blog.pageType == "item"'>
<div class="author-nak1ha">
<img alt="هايف السفراني" class="author_avatar"expr:alt='data:post.author' expr:src='data:post.authorPhoto.url'width='100%'/>
<h3>
الكاتب : <span>
<a href="#" rel="author"><data:post.author/></a>
</span>
</h3>
<p>
اكتب الصيغه هنا </p>
</div>
</b:if>

وتمتع : صفحات هايف

صاحب المدونه : صفحات هايف

اهلا وسهلا فيكم معنا بالمدونه البسيطه ""

HaYeF صفحات

6 اكواد لـ نبذه عن صاحب المدونه بالصور About blogger

صاحب المدونه : صفحات هايف

0 التعليقات :

إرسال تعليق

6 اكواد لـ نبذه عن صاحب المدونه بالصور About blogger

صاحب المدونه : صفحات هايف

مواضيع مشابهة

0 التعليقات :

إرسال تعليق