سلايدر المايسترو لمدونات بلوجر

سلايدر المايسترو

 يعتبر سلايدر المايسترو من اخف وابسط انواع السلايدر
سلايدر المايسترو تم تطويره وتعديله حتى يعمل بشكل جيد مع مدونات بلوجر
يتميز سلايدر المايسترو بالخفه والبساطه وسهولة التركيب

لمعاينه سلايدر المايسترو   معاينه حيه لسلايدر المايسترو

الان ناتى لتركيب سلايدر المايسترو لمدونات بلوجر

1- من لوحة تحكم المدونه اختر قالب
2- اختر تحرير html
3- ابحث عن هذا الكود

<div id='outer-wrapper'>

او هذا الكود

<div id='main-wrapper'>

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

<div id='fotter-wrapper'>

او

<div id='fotter'>

أو يمكنك اختيار المكان المناسب بنفسك وبما يناسب قالب مدونتك احيانا قد يعمل السلايدر ان اضفته داخل آداة HTML/JavaScript لكن ليس دائما ينجح هذا

كود السلايدر انسخ الكود كاملا وضعه كما سبق وتم التوضيح اعلاه

<style type='text/css'>
#th3maestrocarousel {
  display: block;
  height: 185px;
  margin: 10px auto;
  position: relative;
  width: 990px;
}
#th3maestrocarousel .container {
  background-color: #353535;
  height: 185px;
  overflow: hidden;
  position: absolute;
  right: 49px;
  width: 920px !important;
}
#th3maestrocarousel #previous_button {
  background: url(&quot;https://lh6.googleusercontent.com/-ex_ZMAgMdIM/VOnMsQA_fMI/AAAAAAAAFfw/nLzQfiUV4e4/s32/arrow-right.png&quot;) no-repeat scroll center center #E74C3C;
  cursor: pointer;
  height: 185px;
  position: absolute;
  width: 49px;
  z-index: 100;
}
#th3maestrocarousel #previous_button:hover {background-color:#000;}
#th3maestrocarousel #next_button {
  background: url(&quot;https://lh4.googleusercontent.com/-KUDPY67ehdQ/VOnMsZ2J4cI/AAAAAAAAFfs/9lX3Ea9Ecv4/s32/arrow-left.png&quot;) no-repeat scroll center center #E74C3C;
  cursor: pointer;
  height: 185px;
  left: 0;
  position: absolute;
  width: 49px;
  z-index: 100;
}
#th3maestrocarousel #next_button:hover {background-color:#000;}
#th3maestrocarousel ul {
width:100000px;
position:relative;
margin-top:10px;
}
#th3maestrocarousel ul li {
background:#fff url(https://lh6.googleusercontent.com/-OVbpaVVK9To/VPzitR3gZgI/AAAAAAAAFiA/kz405_wJiys/s100/main.png) repeat-x top;
display:inline;
float:right;
text-align:center;
font-weight:700;
font-size:.9em;
line-height:1.2em;
border:1px solid #ccc;
width:145px;
height:150px;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
margin:0 4px 20px 7px;
padding:6px;
}
#th3maestrocarousel ul li:hover {
filter:alpha(opacity=75);
opacity:.75;
}
#th3maestrocarousel ul li a.slider_title {
  color:#555;
  display: block;
  font: 12px GESSTwoMediumRegular;
  margin-top: 10px;
}
#th3maestrocarousel ul li a.slider_title:hover {color:#000;}
#th3maestrocarousel a img {
display:block;
background:#fff;
margin-top:0;
}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script src='https://th3maestro.googlecode.com/svn/trunk/js/th3maestrocarousel.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "https://lh5.googleusercontent.com/-ZsfNyKwmqRw/VGNAlUqogpI/AAAAAAAAFEI/bUv8oUcafwI/s500/No_image.gif";
showRandomImg = true;
aBold = true;
summaryPost = 150;
summaryTitle = 25;
numposts1 = 15;
label1 = "اضافات بلوجر";
function removeHtmlTag(strx,chop){
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
s = s.join("");
s = s.substring(0,chop-1);
return s;
}
function showrecentposts(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('<ul>');
for (var i = 0; i < numposts1; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var pcm;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
pcm = entry.link[k].title.split(" ")[0];
break;
}
}
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
postdate = entry.published.$t;
if(j>imgr.length-1) j=0;
img[i] = imgr[j];
s = postcontent ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);
if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;
//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';
var month = [1,2,3,4,5,6,7,8,9,10,11,12];
var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
var day = postdate.split("-")[2].substring(0,2);
var m = postdate.split("-")[1];
var y = postdate.split("-")[0];
for(var u2=0;u2<month.length;u2++){
if(parseInt(m)==month[u2]) {
m = month2[u2] ; break;
}
}
var daystr = day+ ' ' + m + ' ' + y ;
var trtd = '<li class="car"><div class="thumb"><a href="'+posturl+'"><img width="145" height="100" class="alignnone" src="'+img[i]+'"/></a></div><p><a class="slider_title" href="'+posturl+'">'+posttitle+'</a></p></li>';
document.write(trtd);
j++;
}
document.write('</ul>');
}
//]]>
</script>
<div id='th3maestrocarousel'>
<div id='previous_button'/>
<div class='container'>
<script type='text/javascript'>
document.write(&quot;&lt;script src=\&quot;/feeds/posts/default/-/&quot;+label1+&quot;?max-results=&quot;+numposts1+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
<div class='clear'/>
</div>
<div id='next_button'/>
</div>
<script type='text/javascript'>
(function($) { $(document).ready(function(){
$(&quot;#th3maestrocarousel .container&quot;).jth3maestrocarouselLite({
auto:4000,
scroll: 1,
speed: 800,
visible: 5,
start: 0,
circular: true,
btnPrev: &quot;#previous_button&quot;,
btnNext: &quot;#next_button&quot;
});
})})(jQuery)
</script>

اعدادات سلايدر المايسترو 

استبدال كلمة اضافات بلوجر بإسم القسم الذي تريد جلب المواضيع منه
الرقم 15 هو عدد المواضيع

تنسيق سلايدر المايسترو

استبدل هذا اللون #E74C3C لتغيير الون الأحمر الخاص بازرار التنقل هذا #353535 هو لون خلفية المشاركات بالنسبة للرقمين 990 و920 هما عرض السلايدر ان اردت تقليل العرض فقط غير الرقمين بنفس النسبة ان خفضت احدهما 50 تخفض الآخر 50 للحفاظ على تناسق السلايدر

HashtagsTech

هاشتاج التقنيه قوالب واضافات بلوجر وجديد الاخبار التقنيه

Facebook

Twitter

Instagram

شارك هذا الموضوع