loulou ange
11-01-2013, بتوقيت غرينيتش 08:15 AM
اليوم سنتعرف على كيفية اضافة سلايدشو مدونة blog المساعد الالكتروني
من بين اهم خصائصه:
امه اتوماتيكي
طريقة تركيب install إضافة السلايدر في مدونات بلوجر الشخصية :
وقبل القيام باي تغيير قم بحفظ نسخة احتياطية للقالب template, من لوحة التحكم اتجه الى تصميم ثم تحرير HTML, ضع علامة في خانة توسيع القوالب, ثم إضغط في الكيبورد على Ctrl + F, و ابحث عن الكود code التالي :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]]]></b:skin>
[CENTER][/CENTER][/CENTER]
</code> </code>
ثم ضع فوقه/قبله كود code CSS التالي :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]#alwansd{
[CENTER]height: 397px;
margin: 0 0 20px 20px;
padding: 15px 17px 15px 16px;
width: 617px;
background: #373737;
border-top: 4px solid #00B4FF;
}
.alwanw{
position: relative;
height:385px;
}
.alwanw .contentdiv{
visibility: hidden;
position: absolute;
opacity: 1;
}
.alwan-ps{
text-align: right;
float: left;
width: 618px;
height: 11px;
margin-left: -1px;
}
.alwan-ps .toc{
font-size: 0px;
width: 50.5px;
height: 11px;
float: right;
background: #5b5b5b;
margin-left: 1px;
}
.alwan-ps a.selected{
background:#dfdfdf;
}
.alwan-ps .prev, .alwan-ps .next {display:none; }
.alwanip{
width: 597px;
padding: 10px !important;
bottom: 0;
float: left !important;
position: absolute;
background:url(http://3.bp.blogspot.com/--PmJCnAgSsc/USDs0q1v30I/AAAAAAAADoY/_nmnrEqXG4U/s1600/backslide.png);
}
.alwanip a{
color:#dcdcdc;
font: 12px droidkufi-bold;
margin:0;
padding:0;
line-height: 19px;
}
.alwanip h6{margin: 0;}
.alwanip h6 a:hover {color:#ffa800;}
.alwanip .alwand{font:12px arial; margin:4px 0; color:#a5a5a5; }
.alwanip p{font-size: 13px;
margin: 0;
color: #a5a5a5;
line-height: 23px;
}
.alwansf a img{float: right !important; }
.alwansf {float: right !important; width:100px !important;}
.column-center-outer {
width: 100%;
}
[/CENTER][/CENTER]
</code> </code>
مع تغيير 00b4ff# بي اللون الطاغي في مدونتك و اللذي يمكنك الحصول عليه من هنا
الآن ابحث عن :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]</head>
[CENTER][/CENTER][/CENTER]
</code> </code>
الآن أضف الكود code التالي فوقه/قبله :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<script>
[CENTER]imgr = new Array();
imgr[0] = "http://lh3.ggpht.com/_kViOplhgIHI/TKxBIScZTiI/AAAAAAAAAWE/PM7AQ1lf6ME/noimages.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 150;[/CENTER][/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER]numposts1 = 12;[/CENTER]
[CENTER]label1 = "المزيد";[/CENTER]
[CENTER]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].le ngth)}}s=s.join("");s=s.substring(0,chop-1);return s}[/CENTER]
[CENTER]function showrecentposts1(json){j=(showRandomImg)?Math.floo r((imgr.length+1)*Math.random()):0;img=new Array();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}}fo r(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} }[/CENTER]
[CENTER]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;
var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["يناير","فبراير","مارس","ابريل","مايو","يو نيو","يوليو","أغسطس","سبتمبر","أكتوبر","نوفمبر","د يسمبر"];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[u 2]){m=month2[u2];break;
}}
var daystr = day+ ' ' + m + ' ' + y ;
var trtd = '<div class="contentdiv"><div class="alwansf"><a href="'+posturl+'"><img width="617" height="385" class="alignnone" src="'+img[i]+'"/></a><div class="sliderPostInfo"></div></div><div class="alwanip"><h6><a href="'+posturl+'">'+posttitle+'</a></h6><div class="alwand" >'+daystr+'</div><p>'+removeHtmlTag(postcontent,summaryPost)+'. ..</p></div></div>';
document.write(trtd);
j++;
}}
</script>[/CENTER]
[CENTER][/CENTER][/CENTER]
</code> </code>
مع تغيير (المزيد) باسم القسم الذي سيتم عرض مواضيعه عشوائيا
بعد ذلك ابحث عن :
رمز PHP:
<code style="white-space:nowrap"> <code>
[CENTER]</body>
[CENTER][/CENTER][/CENTER]
</code> </code>
ثم الآن أضف الكود code التالي فوقه/قبله :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<script src='http://dl.dropbox.com/u/12924430/contentslider.js'></script>
[CENTER]<script>
featuredcontentslider.init({
id: "slider1", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["Previous", "Next"], //labels for "prev" and "next" links. Set to "" to hide.
enablefade: [true, 0.5], //[true/false, fadedegree]
autorotate: [true, 6000], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})
</script>[/CENTER][/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER][/CENTER][/CENTER]
</code> </code>
وفي الأخير قم بالبحث عن هذا الكود code :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<div id='main-wrapper'>أو<div id='content'>أو<div id="content"></div>أو <div class='column-center-inner'>[/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER][/CENTER][/CENTER]
</code> </code>
القالب template أضف الكود code التالي بعده/أسفله :
(ملاحظة : إذا لم تجد أي كود code من هذه الأكواد فقم بالبحت عن هذا الكود code :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<b:section class='main' id='main' showaddelement='no'>
[CENTER][/CENTER][/CENTER]
</code> </code>
ثم ضع الكود code الأتي فوقه/قبله )
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<b:if cond='data:blog.pageType == "index"'>
[CENTER]<div id='alwansd'>[/CENTER][/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER]<div class='alwanw' id='slider1'>[/CENTER]
[CENTER]<script>[/CENTER]
[CENTER]document.write("<script src=\"/feeds/posts/default/-/"+label1+"?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");[/CENTER]
[CENTER]</script>[/CENTER]
[CENTER]</div>
<div class='alwan-ps' id='paginate-slider1'>
</div>
</div>
</b:if>[/CENTER]
[/CENTER]
</code> </code>
اي مشكلة او استفسار ضعها في التعليق
المصدر :المساعدالاكتروني (http://az64852.blogspot.com/2014/07/blog-post_24.html)
http://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gif:i con30:http://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gif
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
من بين اهم خصائصه:
امه اتوماتيكي
طريقة تركيب install إضافة السلايدر في مدونات بلوجر الشخصية :
وقبل القيام باي تغيير قم بحفظ نسخة احتياطية للقالب template, من لوحة التحكم اتجه الى تصميم ثم تحرير HTML, ضع علامة في خانة توسيع القوالب, ثم إضغط في الكيبورد على Ctrl + F, و ابحث عن الكود code التالي :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]]]></b:skin>
[CENTER][/CENTER][/CENTER]
</code> </code>
ثم ضع فوقه/قبله كود code CSS التالي :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]#alwansd{
[CENTER]height: 397px;
margin: 0 0 20px 20px;
padding: 15px 17px 15px 16px;
width: 617px;
background: #373737;
border-top: 4px solid #00B4FF;
}
.alwanw{
position: relative;
height:385px;
}
.alwanw .contentdiv{
visibility: hidden;
position: absolute;
opacity: 1;
}
.alwan-ps{
text-align: right;
float: left;
width: 618px;
height: 11px;
margin-left: -1px;
}
.alwan-ps .toc{
font-size: 0px;
width: 50.5px;
height: 11px;
float: right;
background: #5b5b5b;
margin-left: 1px;
}
.alwan-ps a.selected{
background:#dfdfdf;
}
.alwan-ps .prev, .alwan-ps .next {display:none; }
.alwanip{
width: 597px;
padding: 10px !important;
bottom: 0;
float: left !important;
position: absolute;
background:url(http://3.bp.blogspot.com/--PmJCnAgSsc/USDs0q1v30I/AAAAAAAADoY/_nmnrEqXG4U/s1600/backslide.png);
}
.alwanip a{
color:#dcdcdc;
font: 12px droidkufi-bold;
margin:0;
padding:0;
line-height: 19px;
}
.alwanip h6{margin: 0;}
.alwanip h6 a:hover {color:#ffa800;}
.alwanip .alwand{font:12px arial; margin:4px 0; color:#a5a5a5; }
.alwanip p{font-size: 13px;
margin: 0;
color: #a5a5a5;
line-height: 23px;
}
.alwansf a img{float: right !important; }
.alwansf {float: right !important; width:100px !important;}
.column-center-outer {
width: 100%;
}
[/CENTER][/CENTER]
</code> </code>
مع تغيير 00b4ff# بي اللون الطاغي في مدونتك و اللذي يمكنك الحصول عليه من هنا
الآن ابحث عن :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]</head>
[CENTER][/CENTER][/CENTER]
</code> </code>
الآن أضف الكود code التالي فوقه/قبله :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<script>
[CENTER]imgr = new Array();
imgr[0] = "http://lh3.ggpht.com/_kViOplhgIHI/TKxBIScZTiI/AAAAAAAAAWE/PM7AQ1lf6ME/noimages.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 150;[/CENTER][/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER]numposts1 = 12;[/CENTER]
[CENTER]label1 = "المزيد";[/CENTER]
[CENTER]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].le ngth)}}s=s.join("");s=s.substring(0,chop-1);return s}[/CENTER]
[CENTER]function showrecentposts1(json){j=(showRandomImg)?Math.floo r((imgr.length+1)*Math.random()):0;img=new Array();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}}fo r(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} }[/CENTER]
[CENTER]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;
var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["يناير","فبراير","مارس","ابريل","مايو","يو نيو","يوليو","أغسطس","سبتمبر","أكتوبر","نوفمبر","د يسمبر"];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[u 2]){m=month2[u2];break;
}}
var daystr = day+ ' ' + m + ' ' + y ;
var trtd = '<div class="contentdiv"><div class="alwansf"><a href="'+posturl+'"><img width="617" height="385" class="alignnone" src="'+img[i]+'"/></a><div class="sliderPostInfo"></div></div><div class="alwanip"><h6><a href="'+posturl+'">'+posttitle+'</a></h6><div class="alwand" >'+daystr+'</div><p>'+removeHtmlTag(postcontent,summaryPost)+'. ..</p></div></div>';
document.write(trtd);
j++;
}}
</script>[/CENTER]
[CENTER][/CENTER][/CENTER]
</code> </code>
مع تغيير (المزيد) باسم القسم الذي سيتم عرض مواضيعه عشوائيا
بعد ذلك ابحث عن :
رمز PHP:
<code style="white-space:nowrap"> <code>
[CENTER]</body>
[CENTER][/CENTER][/CENTER]
</code> </code>
ثم الآن أضف الكود code التالي فوقه/قبله :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<script src='http://dl.dropbox.com/u/12924430/contentslider.js'></script>
[CENTER]<script>
featuredcontentslider.init({
id: "slider1", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["Previous", "Next"], //labels for "prev" and "next" links. Set to "" to hide.
enablefade: [true, 0.5], //[true/false, fadedegree]
autorotate: [true, 6000], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})
</script>[/CENTER][/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER][/CENTER][/CENTER]
</code> </code>
وفي الأخير قم بالبحث عن هذا الكود code :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<div id='main-wrapper'>أو<div id='content'>أو<div id="content"></div>أو <div class='column-center-inner'>[/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER][/CENTER][/CENTER]
</code> </code>
القالب template أضف الكود code التالي بعده/أسفله :
(ملاحظة : إذا لم تجد أي كود code من هذه الأكواد فقم بالبحت عن هذا الكود code :
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<b:section class='main' id='main' showaddelement='no'>
[CENTER][/CENTER][/CENTER]
</code> </code>
ثم ضع الكود code الأتي فوقه/قبله )
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]<b:if cond='data:blog.pageType == "index"'>
[CENTER]<div id='alwansd'>[/CENTER][/CENTER]
</code> </code>
رمز PHP:
<code style="white-space:nowrap"> <code> [CENTER]
[CENTER]<div class='alwanw' id='slider1'>[/CENTER]
[CENTER]<script>[/CENTER]
[CENTER]document.write("<script src=\"/feeds/posts/default/-/"+label1+"?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");[/CENTER]
[CENTER]</script>[/CENTER]
[CENTER]</div>
<div class='alwan-ps' id='paginate-slider1'>
</div>
</div>
</b:if>[/CENTER]
[/CENTER]
</code> </code>
اي مشكلة او استفسار ضعها في التعليق
المصدر :المساعدالاكتروني (http://az64852.blogspot.com/2014/07/blog-post_24.html)
http://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gif:i con30:http://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gifhttp://www.dzbatna.com/images/smilies/icon30.gif
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
