* السلام عليكم ورحمة الله وبركاته ،
تحية طيبة لكل أصدقاء المدونة ومرحبا بكم في تدوينة جديدة بعد غياب عن طرح الجديد ، اليوم سنقدم لكم بادن الله تجميعة لأفضل الاضافات لمنصة بلوجر لتزيين مدوناتكم وتنسيقها بشكل أفضل يروق الزائر الكريم ، فكما تعلمون الزائر في وقتنا الحالي بغض النظر عن المحتوى والذي يعد الأهم صار يهتم بشكل تناسق وجمالية المدونة بحيث اذا وجد المدونة راقية ومنظمة ومنسقة بشكل ممتاز سيتعود على زيارتها يوميا وهذا الكلام لا أتكلمه اعتباطيا بل من خلال تجربتي بالمجال ، بالعكس عندما يجد المدونة غير منظمة وكلها ملخبطة فلن يعود لها مرة أخرى ولو كان المحتوى حصري ، وملاحظة هامة تنسيق المدونة لا يعني أن تملأ مدونتك بالاضافات حتى تجعل الزائر ينتظر كثيرا لتحميل عناصرها ، أعتذر عن الاطالة فقط أريد توضيح هدا الأمر والآن ننتقل لعرض الاضافات :
* اضافة 1 : أزرار المتابعة على مواقع التواصل :
* تضم هذه الاضافة مختلف مواقع التواصل الاجتماعي ، وبتأثير رائع أدعوكم للتعرف عليه بالمعاينة :
* لاضافة الأزرار ما عليكم الا بانشاء أداة جديدة بالسايدبار ولصق الكود التالي عليها والتعديل عليه :
<div class="content"><div class="tl-socialicons"><div class="tl-socialInner"><!--Facebook--><div class="tl-social"><div class="tl-facebook tl-sinn"><a href="#" target="_blank" title="Facebook"><span class="tl-sicon"><i class="fa fa-facebook"></i></span><span class="tl-scount">3.7K</span></a></div></div><!--Google Plus--><div class="tl-social"><div class="tl-googleplus tl-sinn"><a href="#" target="_blank" title="Google Plus"><span class="tl-sicon"><i class="fa fa-google-plus"></i></span><span class="tl-scount">2K</span></a></div></div><!--Twitter--><div class="tl-social"><div class="tl-twitter tl-sinn"><a href="#" target="_blank" title="Twitter"><span class="tl-sicon"><i class="fa fa-twitter"></i></span><span class="tl-scount">2.4K</span></a></div></div><!--Instagram--><div class="tl-social"><div class="tl-instagram tl-sinn"><a href="#" target="_blank" title="Instagram"><span class="tl-sicon"><i class="fa fa-instagram"></i></span><span class="tl-scount">2K</span></a></div></div><!--Pinterest--><div class="tl-social"><div class="tl-pinterest tl-sinn"><a href="#" target="_blank" title="Pinterest"><span class="tl-sicon"><i class="fa fa-pinterest"></i></span><span class="tl-scount">9.5K</span></a></div></div><!--Youtube--><div class="tl-social"><div class="tl-youtube tl-sinn"><a href="#" target="_blank" title="YouTube"><span class="tl-sicon"><i class="fa fa-youtube"></i></span><span class="tl-scount">3.8K</span></a></div></div><!--Vine--><div class="tl-social"><div class="tl-vine tl-sinn"><a href="#" target="_blank" title="Vine"><span class="tl-sicon"><i class="fa fa-vine"></i></span><span class="tl-scount">3.3K</span></a></div></div><!--SoundCloud--><div class="tl-social"><div class="tl-soundcloud tl-sinn"><a href="#" target="_blank" title="SoundCloud"><span class="tl-sicon"><i class="fa fa-soundcloud"></i></span><span class="tl-scount">1.9K</span></a></div></div><!--VK--><div class="tl-social"><div class="tl-vk tl-sinn"><a href="#" target="_blank" title="VK"><span class="tl-sicon"><i class="fa fa-vk"></i></span><span class="tl-scount">2.9K</span></a></div></div><!----><div class="tl-social"><div class="tl-foursquare tl-sinn"><a href="#" target="_blank" title="Foursquare"><span class="tl-sicon"><i class="fa fa-foursquare"></i></span><span class="tl-scount">3.9K</span></a></div></div><!--GitHub--><div class="tl-social"><div class="tl-github tl-sinn"><a href="#" target="_blank" title="GitHub"><span class="tl-sicon"><i class="fa fa-github"></i></span><span class="tl-scount">3.9K</span></a></div></div><!--Dribbble--><div class="tl-social"><div class="tl-dribbble tl-sinn"><a href="#" target="_blank" title="Dribbble"><span class="tl-sicon"><i class="fa fa-dribbble"></i></span><span class="tl-scount">4.9K</span></a></div></div></div></div></div><style>/* Social Media */.list-unstyled{padding-Right:0;list-style:none;margin:2px}.list-inline li{display:inline-block;padding-right:5px;padding-Right:5px;margin-bottom:10px}.tl-colored-social .fa,.tl-social-icons .fa{font-size:16px}.tl-colored-social .fa,.tl-social-icons .fa{-webkit-transition:all 0.3s ease-in-out;-moz-transition:all 0.3s ease-in-out;-ms-transition:all 0.3s ease-in-out;-o-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out}.tl-colored-social .fa,.tl-social-icons .fa{width:35px;height:35px;line-height:35px;text-align:center;color:#FFF;color:rgba(255,255,255,0.8)}.tl-colored-social.icon-circle .fa,.tl-social-icons.icon-circle .fa{border-radius:50%}.tl-colored-social.icon-rounded .fa,.tl-social-icons.icon-rounded .fa{border-radius:2px}.tl-colored-social.icon-flat .fa,.tl-social-icons.icon-flat .fa{border-radius:0}.tl-colored-social .fa:hover,.tl-colored-social .fa:active,.tl-social-icons .fa:hover,.tl-social-icons .fa:active{color:#FFF}.tl-colored-social.icon-zoom .fa:hover,.tl-colored-social.icon-zoom .fa:active,.tl-social-icons.icon-zoom .fa:hover,.tl-social-icons.icon-zoom .fa:active,.tl-social-sidebar li:hover{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-ms-transform:scale(1.1);-o-transform:scale(1.1);transform:scale(1.1)}.tl-colored-social.icon-rotate .fa:hover,.tl-colored-social.icon-rotate .fa:active,.tl-social-icons.icon-rotate .fa:hover,.tl-social-icons.icon-rotate .fa:active{-webkit-transform:scale(1.1) rotate(360deg);-moz-transform:scale(1.1) rotate(360deg);-ms-transform:scale(1.1) rotate(360deg);-o-transform:scale(1.1) rotate(360deg);transform:scale(1.1) rotate(360deg)}.tl-colored-social .fa-dribbble,.tl-social-icons .fa-dribbble:hover,.tl-socialicons .tl-dribbble:hover .tl-sicon{background-color:#F46899}.tl-colored-social .fa-stumbleupon,.tl-social-icons .fa-stumbleupon:hover{background-color:#eb4924}.tl-colored-social .fa-reddit,.tl-social-icons .fa-reddit:hover{background-color:#5f99cf}.tl-colored-social .fa-facebook,.tl-social-icons .fa-facebook:hover,.tl-socialicons .tl-facebook:hover .tl-sicon{background-color:#3C599F}.tl-colored-social .fa-rss,.tl-social-icons .fa-rss:hover{background-color:#f26522}.tl-colored-social .fa-lastfm,.tl-social-icons .fa-lastfm:hover{background-color:#d51007}.tl-colored-social .fa-flickr,.tl-social-icons .fa-flickr:hover{background-color:#FF0084}.tl-colored-social .fa-instagram,.tl-social-icons .fa-instagram:hover,.tl-socialicons .tl-instagram:hover .tl-sicon{background-color:#685243}.tl-colored-social .fa-foursquare,.tl-social-icons .fa-foursquare:hover,.tl-socialicons .tl-foursquare:hover .tl-sicon{background-color:#0086BE}.tl-colored-social .fa-github,.tl-social-icons .fa-github:hover,.tl-socialicons .tl-github:hover .tl-sicon{background-color:#070709}.tl-colored-social .fa-google-plus,.tl-social-icons .fa-google-plus:hover,.tl-socialicons .tl-googleplus:hover .tl-sicon{background-color:#CF3D2E}.tl-colored-social .fa-instagram,.tl-social-icons .fa-instagram:hover{background-color:#A1755C}.tl-colored-social .fa-linkedin,.tl-social-icons .fa-link edin:hover{background-color:#0085AE}.tl-colored-social .fa-pinterest,.tl-social-icons .fa-pinterest:hover,.tl-socialicons .tl-pinterest:hover .tl-sicon{background-color:#CC2127}.tl-colored-social .fa-twitter,.tl-social-icons .fa-twitter:hover,.tl-socialicons .tl-twitt=àeàr:hover .tl-sicon{background-color:#32CCFE}.tl-colored-social .fa-vk,.tl-social-icons .fa-vk:hover,.tl-socialicons .tl-vk:hover .tl-sicon{background-color:#375474}.tl-colored-social .fa-soundcloud,.tl-social-icons .fa-soundcloud:hover,.tl-socialicons .tl-soundcloud:hover .tl-sicon{background-color:#FF4100}.tl-colored-social .fa-vine,.tl-social-icons .fa-vine:hover,.tl-socialicons .tl-vine:hover .tl-sicon{background-color:#35B57C}.tl-colored-social .fa-xing,.tl-social-icons .fa-xing:hover{background-color:#00555C}.tl-colored-social .fa-youtube,.tl-social-icons .fa-youtube:hover,.tl-socialicons .tl-youtube:hover .tl-sicon{background-color:#C52F30}.top-social ul li{margin:0;padding:0}div#socialicons-top{float:right}.top-social .list-unstyled{margin:0}.tl-socialicons{text-align:center;overflow:auto;font-size:22px;margin:0 -8px}.tl-socialicons .tl-socialInner{position:relative;overflow:hidden;padding-Right:8px}.tl-socialicons .tl-social{float:right;width:25%}.tl-socialicons .tl-sinn{padding-right:8px}.tl-socialicons .tl-sinn:hover .tl-sicon{color:#fff}.tl-socialicons .tl-sicon{display:block;padding:10px 0;}.tl-socialicons .tl-facebook .tl-sicon{color:#3B5998}.tl-socialicons .tl-googleplus .tl-sicon{color:#DD4B39}.tl-socialicons .tl-twitter .tl-sicon{color:#2AA9E0}.tl-socialicons .tl-instagram .tl-sicon{color:#685243}.tl-socialicons .tl-pinterest .tl-sicon{color:#CC2028}.tl-socialicons .tl-youtube .tl-sicon{color:#DE1829}.tl-socialicons .tl-vine .tl-sicon{color:#35B57C}.tl-socialicons .tl-soundcloud .tl-sicon{color:#FF4100}.tl-socialicons .tl-vk .tl-sicon{color:#45668e}.tl-socialicons .tl-foursquare .tl-sicon{color:#f94877}.tl-socialicons .tl-github .tl-sicon{color:#333333}.tl-socialicons .tl-dribbble .tl-sicon{color:#ea4c89}.tl-socialicons .tl-sicon{-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-ms-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease}.tl-socialicons .tl-scount{display:block;color:#eeeeee;background:#3d3d3d;padding:5px 0;position:relative;margin-bottom:8px;font-size:14px;font-weight:600}.tl-socialicons .tl-scount:after{bottom:100%;Right:50%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-color:rgba(238,238,238,0);border-bottom-color:#2e2e2e;border-width:4px;margin-Right:-4px}</style
* يجب أن تتوفر على هذا السكربت " أسفله " لكي تشتغل الاضافة والذي يكون فوق وسم </head> ادا لم تكن تتوفر عليه فقم باضافته :
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>
اضافة 2 : شريط أخبار بالسايدبار
* عبارة عن شريط أخبار متحرك جميل ، أنيق وبسيط ، يعمل بالخلاصات ويضم أزرار المشاركة على المواقع الاجتماعية .
* لاضافة الشريط ما عليك الا اضافة أداة جديدة ثم لصق الكود التالي بها :
<style>
.MBL-container-header h1{font-weight:300; font-size:48px; text-align:center;}
.MBL-container-header h2{font-size:30px; text-align:center;}
#MBLnewsticker1 ul { padding: 0px; }
.MBLnewsticker {
width: 100%;
overflow: hidden;
height: 440px;
position: relative;
padding: 0 5px;
box-sizing: border-box;
margin: 0 auto;
text-align:center;
}
.MBLnewsticker>ul {
padding: 0;
margin: 0;
list-style-type: none;
position: relative;
}
.MBLnewsticker>ul>li {
display: none;
width: 100%;
height: 100px;
background: #FFF;
position: absolute;
overflow: hidden
}
.MBLnewsticker>ul>li>.MBL-content {
position: absolute;
top: 0;
bottom: 30px;
left: 0;
right: 0;
box-sizing: border-box;
padding: 5%;
font: 14px/1.8em tahoma;
overflow: hidden;
}
.MBLnewsticker>ul>li>.MBL-content a {
text-decoration: none;
}
.MBLnewsticker>ul>li>.MBL-content a:hover {
text-decoration: underline;
}
.MBLnewsticker>ul>li>.MBL-info {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 30px;
padding: 5px;
border-top: solid 1px #DDD;
}
.MBLnewsticker>ul>li>.MBL-info a {
display: inline-block;
width: 20px;
height: 20px;
background: #0F0;
opacity: 0.2;
cursor: pointer;
}
.MBLnewsticker>ul>li>.MBL-info a:hover {
opacity: 1;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-facebook-black {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_fG1MQ6qo3AcEf2joJ3ma8d8fJbwd1lcJLHoo9inbvQMauu2bALmRl-PbVqKW3M0Drwc4xOHtFd_VlMrxNtmX0oPsTPH8dz1P1XSSfhxmodzdDh2o6tLNSrHISsUZ8Bcm7-oIscghhtnF/s1600/buttons-black.png) 0 0 no-repeat;
float: left;
margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-twitter-black {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_fG1MQ6qo3AcEf2joJ3ma8d8fJbwd1lcJLHoo9inbvQMauu2bALmRl-PbVqKW3M0Drwc4xOHtFd_VlMrxNtmX0oPsTPH8dz1P1XSSfhxmodzdDh2o6tLNSrHISsUZ8Bcm7-oIscghhtnF/s1600/buttons-black.png) -20px 0 no-repeat;
float: left;
margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-google-black {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_fG1MQ6qo3AcEf2joJ3ma8d8fJbwd1lcJLHoo9inbvQMauu2bALmRl-PbVqKW3M0Drwc4xOHtFd_VlMrxNtmX0oPsTPH8dz1P1XSSfhxmodzdDh2o6tLNSrHISsUZ8Bcm7-oIscghhtnF/s1600/buttons-black.png) -40px 0 no-repeat;
float: left;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-link-black {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_fG1MQ6qo3AcEf2joJ3ma8d8fJbwd1lcJLHoo9inbvQMauu2bALmRl-PbVqKW3M0Drwc4xOHtFd_VlMrxNtmX0oPsTPH8dz1P1XSSfhxmodzdDh2o6tLNSrHISsUZ8Bcm7-oIscghhtnF/s1600/buttons-black.png) -60px 0 no-repeat;
float: right;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-facebook-white {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMSA0ALEJ25WAIvZPKlK64QHBNjVMdYfMQvjMVueu60gEryqYpSZ_bYTeJo4gTxq01sTcQEPXksxg0tezfgD5iChCv6RU9jODi5zbUpk8oM8LZoIdj1P2VeuLzue_sveE-lUKLWLZo6AHO/s1600/buttons-white.png) 0 0 no-repeat;
float: left;
margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-twitter-white {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMSA0ALEJ25WAIvZPKlK64QHBNjVMdYfMQvjMVueu60gEryqYpSZ_bYTeJo4gTxq01sTcQEPXksxg0tezfgD5iChCv6RU9jODi5zbUpk8oM8LZoIdj1P2VeuLzue_sveE-lUKLWLZo6AHO/s1600/buttons-white.png) -20px 0 no-repeat;
float: left;
margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-google-white {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMSA0ALEJ25WAIvZPKlK64QHBNjVMdYfMQvjMVueu60gEryqYpSZ_bYTeJo4gTxq01sTcQEPXksxg0tezfgD5iChCv6RU9jODi5zbUpk8oM8LZoIdj1P2VeuLzue_sveE-lUKLWLZo6AHO/s1600/buttons-white.png) -40px 0 no-repeat;
float: left;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-link-white {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMSA0ALEJ25WAIvZPKlK64QHBNjVMdYfMQvjMVueu60gEryqYpSZ_bYTeJo4gTxq01sTcQEPXksxg0tezfgD5iChCv6RU9jODi5zbUpk8oM8LZoIdj1P2VeuLzue_sveE-lUKLWLZo6AHO/s1600/buttons-white.png) -60px 0 no-repeat;
float: right;
}
.MBLnewsticker>ul>li>.MBL-info span {
position: absolute;
left: 80px;
right: 60px;
text-align: center;
opacity: 0.4;
z-index: 0;
font-size: 13px;
cursor: default;
}
.MBLnewsticker>div {
width: 50px;
height: 30px;
cursor: pointer;
position: absolute;
opacity: 0.3;
}
.MBLnewsticker>div:hover {
opacity: 1;
}
.MBLnewsticker>div.MBL-top-arrow {
top: 0;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NlXWlWReqJf2JG9uOlXEkHtN_iXNeIx8qiLTLUWXW-3Wl1GfveOPoEAY-BoZT3QGIr2_1HeLY5p_A3rC_TocmH_cVTsfnCOBefk9Nld0KQ5d42Y51X0VBh2qQ-Fz2tDdbDhMFTahT2x9/s1600/arrows-black.png) top no-repeat;
}
.MBLnewsticker>div.MBL-bottom-arrow {
bottom: 0;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NlXWlWReqJf2JG9uOlXEkHtN_iXNeIx8qiLTLUWXW-3Wl1GfveOPoEAY-BoZT3QGIr2_1HeLY5p_A3rC_TocmH_cVTsfnCOBefk9Nld0KQ5d42Y51X0VBh2qQ-Fz2tDdbDhMFTahT2x9/s1600/arrows-black.png) bottom no-repeat;
}
.MBLnewsticker .MBL-top0 {
-ms-transform: scale(0.80);
-webkit-transform: scale(0.85);
transform: scale(0.85);
opacity: 0.85;
top: 0;
z-index: 1;
display: block;
}
.MBLnewsticker .MBL-top1 {
-ms-transform: scale(0.87);
-webkit-transform: scale(0.9);
transform: scale(0.9);
opacity: 0.9;
top: 20px;
z-index: 2;
display: block;
}
.MBLnewsticker .MBL-top2 {
-ms-transform: scale(0.95);
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0.95;
top: 45px;
z-index: 3;
display: block;
}
.MBLnewsticker .MBL-active {
-ms-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1;
top: 75px;
z-index: 10;
display: block;
}
.MBLnewsticker .MBL-bottom2 {
-ms-transform: scale(0.95);
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0.95;
top: 105px;
z-index: 6;
display: block;
}
.MBLnewsticker .MBL-bottom1 {
-ms-transform: scale(0.87);
-webkit-transform: scale(0.90);
transform: scale(0.90);
opacity: 0.9;
top: 130px;
z-index: 5;
display: block;
}
.MBLnewsticker .MBL-bottom0 {
-ms-transform: scale(0.80);
-webkit-transform: scale(0.85);
transform: scale(0.85);
opacity: 0.85;
top: 150px;
z-index: 4;
display: block;
}
.MBL-easing2 {
transition: .25s linear;
-moz-transition: .25s linear;
-webkit-transition: .25s linear;
}
.MBL-easing li {
transition: .5s ease-out;
-moz-transition: .5s ease-out;
-webkit-transition: .5s ease-out;
}
.MBL-radius li {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.MBL-radius2 li {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.MBL-shadow li {
-webkit-box-shadow: 0px 0px 10px 0px rgba(100,100,100,0.3);
-moz-box-shadow: 0px 0px 10px 0px rgba(100,100,100,0.3);
box-shadow: 0px 0px 10px 0px rgba(100,100,100,0.3);
}
.MBL-shadow-big {
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5) !important;
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5) !important;
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5) !important;
}
</style>
<script type='text/javascript'>
/*<![CDATA[*/
(function(e) {
$.fn.MBLnewsticker = function(e) {
var t = {
width: "100%",
modulid: "MBLnewsticker",
autoplay: true,
timer: 3e3,
itemheight: 130,
infobarvisible: true,
btnfacebook: true,
btntwitter: true,
btngoogleplus: true,
btnlinkbutton: true,
btnlinktarget: "_blank",
pagecountvisible: true,
buttonstyle: "black",
pagenavi: true,
pagenavistyle: "black",
feed: false,
feedcount: 100
};
var e = $.extend(t, e);
return this.each(function() {
function o() {
function o() {
$(e.modulid + ">div").css({
left: ($(e.modulid).width() - 30) / 2
})
}
function u() {
$(e.modulid + " ul li").eq(r[0]).addClass("MBL-top0");
$(e.modulid + " ul li").eq(r[1]).addClass("MBL-top1");
$(e.modulid + " ul li").eq(r[2]).addClass("MBL-top2");
$(e.modulid + " ul li").eq(r[3]).addClass("MBL-active");
$(e.modulid + " ul li").eq(r[4]).addClass("MBL-bottom2");
$(e.modulid + " ul li").eq(r[5]).addClass("MBL-bottom1");
$(e.modulid + " ul li").eq(r[6]).addClass("MBL-bottom0")
}
function a() {
t--;
if (t < 0) t = n;
l()
}
function f() {
t++;
if (t == n + 1) t = 0;
l()
}
function l() {
$(e.modulid + " ul li").attr("class", "");
if (t == 0) {
r[0] = n - 2;
r[1] = n - 1;
r[2] = n;
r[3] = t;
r[4] = t + 1;
r[5] = t + 2;
r[6] = t + 3
} else if (t == 1) {
r[0] = n - 1;
r[1] = n;
r[2] = t - 1;
r[3] = t;
r[4] = t + 1;
r[5] = t + 2;
r[6] = t + 3
} else if (t == 2) {
r[0] = n;
r[1] = t - 2;
r[2] = t - 1;
r[3] = t;
r[4] = t + 1;
r[5] = t + 2;
r[6] = t + 3
} else if (t == n) {
r[0] = n - 3;
r[1] = n - 2;
r[2] = n - 1;
r[3] = t;
r[4] = 0;
r[5] = 1;
r[6] = 2
} else if (t == n - 1) {
r[0] = n - 4;
r[1] = n - 3;
r[2] = n - 2;
r[3] = t;
r[4] = t + 1;
r[5] = 0;
r[6] = 1
} else if (t == n - 2) {
r[0] = n - 5;
r[1] = n - 4;
r[2] = n - 3;
r[3] = t;
r[4] = t + 1;
r[5] = t + 2;
r[6] = 0
} else {
r[0] = t - 3;
r[1] = t - 2;
r[2] = t - 1;
r[3] = t;
r[4] = t + 1;
r[5] = t + 2;
r[6] = t + 3
}
u()
}
$(e.modulid + " ul li").css({
height: e.itemheight,
background: e.itembgcolor,
border: "solid 1px " + e.bordercolor,
color: e.titlecolor,
"font-size": e.titlefontsize
});
$(e.modulid + " ul li").each(function(t, r) {
if (e.infobarvisible) {
i = '<div class="MBL-info" style="background:' + e.infobgcolor + "; border-color:" + e.bordercolor + ';">';
if (e.btnfacebook) i = i + '<a data-type="facebook" data-url="' + $(this).find(".MBL-content").attr("data-link") + '" data-text="' + $(this).find(".MBL-content").text() + '" class="MBL-easing2 MBL-facebook-' + e.buttonstyle + '"></a>';
if (e.btntwitter) i = i + '<a data-type="twitter" data-url="' + $(this).find(".MBL-content").attr("data-link") + '" data-text="' + $(this).find(".MBL-content").text() + '" class="MBL-easing2 MBL-twitter-' + e.buttonstyle + '"></a>';
if (e.btngoogleplus) i = i + '<a data-type="google" data-url="' + $(this).find(".MBL-content").attr("data-link") + '" data-text="' + $(this).find(".MBL-content").text() + '" class="MBL-easing2 MBL-google-' + e.buttonstyle + '"></a>';
if (e.pagecountvisible) i = i + "<span>" + ($(this).index() + 1) + " / " + (n + 1) + "</span>";
if (e.btnlinkbutton) i = i + '<a href="' + $(this).find(".MBL-content").attr("data-link") + '" class="MBL-easing2 MBL-link-' + e.buttonstyle + '" target="' + e.btnlinktarget + '"></a>';
i = i + "</div>"
}
$(this).append(i)
});
$(e.modulid + " ul li .MBL-content").find("a").css({
color: e.contentlinkcolor
});
$(e.modulid + " ul li").find(".MBL-info").find("a").click(function(e) {
if ($(this).attr("data-type") == "facebook") {
window.open("http://www.facebook.com/sharer.php?u=" + encodeURIComponent($(this).attr("data-url")) + "&t=" + encodeURIComponent($(this).attr("data-text")), "sharer", "toolbar=0,status=0,width=626,height=436");
return false
} else if ($(this).attr("data-type") == "twitter") {
window.open("http://twitter.com/share?text=" + $(this).attr("data-text") + "&url=" + $(this).attr("data-url"), "sharer", "toolbar=0,status=0,width=626,height=436");
return false
} else if ($(this).attr("data-type") == "google") {
window.open("https://plus.google.com/share?url=" + $(this).attr("data-url") + "&title=" + $(this).attr("data-text"), "sharer", "height=550,width=525,left=100,top=100,menubar=0");
return false
}
});
$(e.modulid + " ul li").click(function(e) {
t = $(this).index();
l()
});
if (e.pagenavi) {
$(e.modulid).append('<div class="MBL-top-arrow"></div><div class="MBL-bottom-arrow"></div>');
$(e.modulid).css({
height: e.itemheight + 200,
padding: "20px 10px",
width: e.width
})
} else {
$(e.modulid).css({
height: e.itemheight + 160,
padding: "0px 10px",
width: e.width
})
}
o();
$(window).resize(function(e) {
o()
});
u();
$(e.modulid + ">div").click(function(e) {
if ($(this).attr("class") == "MBL-top-arrow") a();
else f()
});
if (e.autoplay) {
s = setInterval(function() {
f()
}, e.timer);
$(e.modulid).hover(function() {
clearInterval(s)
}, function() {
s = setInterval(function() {
f()
}, e.timer)
})
}
}
function u() {
$.ajax({
type: "GET",
url: document.location.protocol + "//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=" + e.feedcount + "&callback=?&q=" + encodeURIComponent(e.feed),
dataType: "json",
async: false,
success: function(i) {
veri = i.responseData.feed.entries;
news = "";
$(veri).each(function(e, t) {
if (e == 0) news = news + '<li class="MBL-active"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
else if (e == 1) news = news + '<li class="MBL-bottom2"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
else if (e == 2) news = news + '<li class="MBL-bottom1"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
else if (e == 3) news = news + '<li class="MBL-bottom0"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
else if (e == veri.length - 1) news = news + '<li class="MBL-top2"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
else if (e == veri.length - 2) news = news + '<li class="MBL-top1"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
else if (e == veri.length - 3) news = news + '<li class="MBL-top0"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
else news = news + '<li><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>"
});
$(e.modulid + " ul").html("");
$(e.modulid + " ul").append(news);
n = veri.length - 1;
r = [n - 2, n - 1, n, t, t + 1, t + 2, t + 3];
o()
},
error: function() {
$(e.modulid + " ul").html('<li class="MBL-active"><div class="MBL-content">Error! Please try again later...</div></li>')
}
})
}
e.modulid = "#" + $(this).attr("id");
var t = 0;
var n = $(e.modulid + " ul li").length - 1;
var r = [n - 2, n - 1, n, t, t + 1, t + 2, t + 3];
var i = "";
var s = e.modulid;
if (e.feed != false) {
$(e.modulid + " ul").html("");
$(e.modulid + " ul").append('<li class="MBL-active"><div class="MBL-content">جاري التحميل...</div></li>');
u()
} else {
o()
}
})
}
})(jQuery)
/*]]>*/
</script>
<div class="MBLnewsticker MBL-radius MBL-shadow MBL-easing" id="MBLnewsticker1">
<ul> <li>
</li></ul>
</div>
<script>
$(document).ready(function(){
$("#MBLnewsticker1").MBLnewsticker({
feed:"http://feeds.feedburner.com/feed",
width:"100%",
contentlinkcolor: "#766D6D",
timer:5000,
titlecolor: "#333",
titlefontsize: "16px",
itembgcolor: "#FFF",
contentlinkcolor: "#766D6D",
infobgcolor: "#f2f2f2",
bordercolor: "#DDD"
});
});
</script>
* قم بتخفيض الرقم 5000 لتسريع الشريط ، قم بتعديل كلمة feed الى رابط الخلاصة الخاص بك .
اضافة 3 : سلايدر تلقائي احترافي بالسايدبار
* لاضافة السلايدر ما عليك الا اضافة أداة جديد ، تم لصق الكود التالي بها :
<style scoped="" type="text/css">
@import url(http://fonts.googleapis.com/earlyaccess/droidarabickufi.css);
ul.rcentside *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box }ul.rcentside{font-size:11px}ul.rcentside,ul.rcentside li{margin:0;padding:0;list-style:none;position:relative }ul.rcentside{width:100%;height:500px }ul.rcentside li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none }ul.rcentside li:nth-child(1),ul.rcentside li:nth-child(2),ul.rcentside li:nth-child(3),ul.rcentside li:nth-child(4){display:block }ul.rcentside img{border:0;width:100%;height:auto}ul.rcentside li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0 }ul.rcentside li:nth-child(2){left:0;top:50% }ul.rcentside li:nth-child(3){left:50.5%;top:50% }ul.rcentside li:nth-child(4){width:100%;left:0;top:75% }ul.rcentside .overlayx,ul.rcentside li{transition:all .4s ease-in-out }ul.rcentside .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0OoKUTQDTngwFwXksMM48ULra0I9sWM_5Lq2zKD3L8Kd8SBQ5A5YAc1JwuhXk8AB2dbjCZ34Yygncdk1Mx4FGpHWqT_Se_ClBbRKyox9yZskdU_-Qe5_mNg-6XukMexlUfKZV8-nh_Cw/s1600/linebg-fade.png);background-position:50% 50%;background-repeat:repeat-x }ul.rcentside .overlayx,ul.rcentside img{margin:3px}ul.rcentside li:nth-child(1).overlayx{background-position:50% 25% }ul.rcentside .overlayx:hover{opacity:.1 }ul.rcentside h4{text-align: right; direction: rtl; font-family: droid arabic kufi;position:absolute;bottom:10px;left:10px;right:10px;z-index:2;color:#fff;font-weight:700;margin:0;padding:10px;line-height:1.5em;font-weight:normal;overflow:hidden;transition:all .3s}ul.rcentside li:hover h4{bottom:30px}ul.rcentside li:nth-child(1)h4,ul.rcentside li:nth-child(4)h4{font-size:150% }ul.rcentside .label_text{position:absolute;bottom:0;right:20px;z-index:2;color:#fff;font-size:90%;opacity:0;transition:all .3s;font-family: droid arabic kufi;}ul.rcentside li:hover .label_text{bottom:20px;opacity:1}ul.rcentside li:nth-child(2).autname,ul.rcentside li:nth-child(3).autname{display:none }.buttons{margin:5px 0 0 }.buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative }.buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50% }.buttons a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px }
</style>
<div id="featuredpostside"></div>
<script type='text/javascript'>
function FeaturedPostSide(a){(function(e){var h={blogURL:"",MaxPost:4,idcontaint:"",ImageSize:100,interval:5000,autoplay:false,loadingClass:"loadingxx",pBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",MonthNames:["يناير","فبراير","مارس","أبريل","مايو","يونيو","يوليو","أغسطس","سبتمبر","أكتوبر","نوفمبر","ديسمبر"],tagName:false};h=e.extend({},h,a);var g=e(h.idcontaint);var d=h.MaxPost*200;g.html('<div class="sliderx"><ul class="rcentside"></ul></div><div class="buttons"><a href="#" class="prevx">prev</a><a href="#" class="nextx">next</a></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.ImageSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.ImageSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.MonthNames[parseInt(p,10)-1];l+='<li><a target="_blank" href="'+q+'"><div class="overlayx"></div><img class="random" src="'+u+'"/><h4>'+k+'</h4></a><div class="label_text"><span class="date"><span class="dd">'+t+'</span> <span class="dm">'+v+'</span> <span class="dy">'+x+'</span></span> <span class="autname">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingClass)};var c=function(){e(h.idcontaint+" .nextx").click()};var b=function(){e.get((h.blogURL===""?window.location.protocol+"//"+window.location.host:h.blogURL)+"/feeds/posts/summary"+(h.tagName===false?"":"/-/"+h.tagName)+"?max-results="+h.MaxPost+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.idcontaint+" .prevx").click(function(){e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));return false});e(h.idcontaint+" .nextx").click(function(){e(h.idcontaint+" .sliderx li:last").after(e(h.idcontaint+" .sliderx li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));e(h.idcontaint+" .sliderx").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingClass)},d)};e(document).ready(b)})(jQuery)};
//<![CDATA[
FeaturedPostSide({
blogURL: "http://www.wahatinfo.com",
MaxPost: 8,
idcontaint: "#featuredpostside",
ImageSize: 300,
interval: 5000,
autoplay: true,
tagName: false
});
//]]>
</script>
* ما عليك الا تغير الرابط برابطك الخاص بمدونتك .
اضافة 4 : أداة عرض آخر التعليقات :
<style scoped='' type="text/css"> ul.wahatinfo{list-style:none;margin:0;padding:0;max-height: 380px; overflow: auto;}.wahatinfo li{display:block;clear:both;overflow:hidden;list-style:none;border-bottom:1px solid #e3e3e3;word-break:break-all;padding:10px 0;margin:0}.wahatinfo li .avatarImage{ border-radius: 20% 2% 20%!important;float:right;margin-left:10px;position:relative;overflow:hidden}.wahatinfo li img{position:relative;overflow:hidden;width:42px;height:42px}.wahatinfo li a{font-weight:700}.wahatinfo li span{margin-top:2px;color:#666;display:block;font-size:12px;line-height:1.4; word-break: normal;} </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments function wahatinfo(a){var e;e='<ul class="wahatinfo">';for(var t=0;numComments>t;t++){var r,o,n,i;if(t==a.feed.entry.length)break;e+="<li>";for(var d=a.feed.entry[t],s=0;s<d.link.length;s++)"alternate"==d.link[s].rel&&(r=d.link[s].href);for(var l=0;l<d.author.length;l++)o=d.author[l].name.$t,n=d.author[l].gd$image.src;n=-1!=n.indexOf("/s1600/")?n.replace("/s1600/","/s"+avatarSize+"-c/"):-1!=n.indexOf("/s220/")?n.replace("/s220/","/s"+avatarSize+"-c/"):-1!=n.indexOf("/s512-c/")&&0!=n.indexOf("http:")?"http:"+n.replace("/s512-c/","/s"+avatarSize+"-c/"):-1!=n.indexOf("blogblog.com/img/b16-rounded.gif")?"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ_EAIQk8z-sdxo3xiZJUzaAx5z8-7_UD2menY9uCMO9zDaTUltC5xOH8m-fNVnf6ojuX-3H2ixmiYcO2mre4jXqDD1L4wp3Exl-eanhObyPD0UJP_5FuH2z1te3wJGXMUax6VAfQT_atr/"+avatarSize+"/blogger.png":-1!=n.indexOf("blogblog.com/img/openid16-rounded.gif")?"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAwNZP7GIgc4kBEZXdUg3SNErO0R6CVA45QI_VePqgiG8990vuyxM6B51FlWy9PiT1vlCcICcjWYvu571SiZYeXxS5E4OYGLx5ZOi6D8bRalEX2N_xh5ie7w73Dp7J3V6YdJISlEyBmqui/"+avatarSize+"/openid.png":-1!=n.indexOf("blogblog.com/img/blank.gif")?-1!=defaultAvatar.indexOf("gravatar.com")?defaultAvatar+"&s="+avatarSize:defaultAvatar:n,1==showAvatar&&(i=1==roundAvatar?"avatarRound":"",e+='<div class="avatarImage '+i+'"><img class="'+i+'" src="'+n+'" alt="'+o+'" width="'+avatarSize+'" height="'+avatarSize+'"/></div>'),e+='<a href="'+r+'">'+o+"</a>";var A=d.content.$t,v=A.replace(/(<([^>]+)>)/gi,"");""!=v&&v.length>characters?(v=v.substring(0,characters),v+="…",1==showMorelink&&(v+='<a href="'+r+'">'+moreLinktext+"</a>")):v=v,e+="<span>"+v+"</span>",e+="</li>"}e+="</ul>";var c="";0==hideCredits&&(c="display:block;"),e+="",document.write(e)}var numComments=15,showAvatar=!0,avatarSize=42,roundAvatar=!0,characters=40,showMorelink=!1,defaultAvatar="http://2.bp.blogspot.com/-XjxrXKBPQqs/VYcGtLWPGUI/AAAAAAAAKaQ/5jr871JIwds/s1600/default-avatar.jpg",hideCredits=!0,numComments=numComments||5,avatarSize=avatarSize||60,characters=characters||40,defaultAvatar=defaultAvatar||"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQJ1pH8sVv5rm6Nn-5askTHPAwK4d09zyTvjKKkXvONAyqdrSio1F0TfRiSDzg31U3mZLH6sKfCSgS2qDYYMU3kNFw9f_vrSMxqgmtJ4td80GnV0ad5rZMzPtX2ZG1DI4O5PN-_4hUfRxp/s1600/default-avatar.jpg",moreLinktext=moreLinktext||" More »",showAvatar="undefined"==typeof showAvatar?!0:showAvatar,showMorelink="undefined"==typeof showMorelink?!1:showMorelink,roundAvatar="undefined"==typeof roundAvatar?!0:roundAvatar,hideCredits="undefined"==typeof hideCredits?!1:roundAvatar; //]]> </script> <script type="text/javascript" src="/feeds/comments/default?alt=json&callback=wahatinfo&max-results=10"></script>
* اضافة 5 : الاشتراك في القائمة البريدية :
<style> @import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css); /* Subscribe Box */ .widget-content{padding:0} .subscribe-wrapper h3{font-weight: 700; margin: 0 auto 10px auto; text-align: center; font-size: 20px; line-height: 1.8; font-family: 'Noto Sans Kufi Arabic', sans-serif!important;} .subscribe-wrapper h3 span{display:inline-block;font-weight:bold;font-size:33px;} .subscribe-wrapper p{margin:0 auto;opacity:.95;text-align:center;font-family: 'Droid Arabic Naskh', serif; font-size: 14px;} .subscribe-wrapper{color:#fff;background:#e83e3b;margin:0;padding:20px;} .subscribe-form{clear:both;display:block;margin:5px 0 10px 0;overflow:hidden} form.subscribe-form{clear:both;display:block;margin:10px 0 0;width:auto;overflow:hidden} .subscribe-css-email-field{background:rgba(0,0,0,0.2);color:#fff;margin:0 0 15px;padding:0.962em 1.847em;width:100%;border:none;text-align:center;outline:0} .subscribe-css-button{background: #fff!important; color: #E83E3B!important; cursor: pointer; font-weight: 700; padding: 7px; width: 100%; border: 0; font-size: 15px; text-transform: uppercase; transition: all .3s; font-family: 'Noto Sans Kufi Arabic', sans-serif!important;} .subscribe-css-button:hover{color:#aaa!important;transition:all 0.3s ease-in;} </style> <div id="subscribe-css"> <div class="subscribe-wrapper"> <h3>احصل على أجدد مواضيعنا <span>أول بأول</span></h3> <p>اشترك بنشرتنا البريدية وتوصل بأشياء مثيرة للإهتمام.</p> <div class="subscribe-form"> <form action="http://feedburner.google.com/fb/a/mailverify?uri=ar1web/TFDh" class="subscribe-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=wahatinfo/QSrf', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"> <input name="uri" type="hidden" value="ar1web" /> <input name="loc" type="hidden" value="en_US" /> <input class="subscribe-css-email-field" name="email" autocomplete="off" placeholder="ادخل بريدك الإلكتروني" /> <input class="subscribe-css-button" title="" type="submit" value="اشترك الآن" /> </form> </div> </div></div>
* غير رابط خلاصتي بالرابط الخاص بك
* الى هنا نصل لنهاية التجميعة الاولى نتمنى أن تنال اعجابكم لا تنسواا دعمنا لطرح التجميعة الثانية بادن الله .
L3zz
ردحذفمرحبا خويا شكرا لتعليقك ^^
حذفl3az khoya
ردحذفمرحبا خويا شكرا لتعليقك ^^
حذفMrc
ردحذفName:Yassin Bouafia
Bouafiayassin15@gamail.com Email:
- Website: http://huntingactivity.com
مرحبا خويا شكرا لتعليقك ^^
حذفشكرا كثير
ردحذفلاشكر على واجب تحيااتي ^^
حذفthank you khoya lbarian
ردحذفلاشكر على واجب تحيااتي ^^
حذف