مشكلة اضافة اقرا المزيد لمدونات بلوجر بتقنية الCSS
مشكلة اضافة اقرا المزيد لمدونات بلوجر بتقنية الCSS
@Arwa~ هنا مشكلتك تكمن في انك تضيفي الكود في مكان مغاير للمكان المطلوب .. تابعي معي
اولا عليكي البحث(CTRL+F) عن الوسم التالي </head> واضافة الكود التالي فوقه مباشرة
<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
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);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]></script>
ثم تبحثي(CTRL+F) عن الكود التالي<data:post.body/> ستجدين اكثر من وسم في قالبك (يمكمك الظغطEnter مرة اخرى لتجدي الوسم التالي) المهم استبدلي الكود التالي بدل الكود الثاني(رقم 2) الذي ستجديه بهذا الشكل <data:post.body/> <b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<span class='jump-link' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url'>...اقرأ المزيد</a></span>
<div style='clear: both;'/>
</b:if>
</b:if>
الان لم يبقى علينا سوى اضافات اللمسات الفنية ليظهر لنا اقرا المزيد بشكل جميل لذا نبحث(CTRL+F) عن الوسم التالي ]]></b:skin> لاضافة اكواد الCSS التالية فوقه مباشرة .jump-link {
display: block;
font-size: 12px;
font-weight: bold;
text-align:right;
}
.jump-link a {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
padding: 6px 15px;
background: -moz-linear-gradient(
top,
#ffffff 0%,
#b5b5b5);
background: -webkit-gradient(
linear, left top, left bottom,
from(#ffffff),
to(#b5b5b5));
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
border: 3px solid #0088ff;
-moz-box-shadow:
0px 1px 3px rgba(000,000,000,0.5),
inset 0px 0px 3px rgba(255,255,255,1);
-webkit-box-shadow:
0px 1px 3px rgba(000,000,000,0.5),
inset 0px 0px 3px rgba(255,255,255,1);
box-shadow:
0px 1px 3px rgba(000,000,000,0.5),
inset 0px 0px 3px rgba(255,255,255,1);
text-shadow:
0px 1px 2px rgba(000,000,000,0.5),
0px 1px 2px rgba(252,254,255,0.9);
}
اذا لم يعجبك شكل الزر يمكنك اختيار اي شكل من الاشكال التالية واستبدال كود الCSS بالكود الخاص بها من هنا
4 التعليقات
شكراً شكراً جزيلاً لك |o| اقدر مجهود الجمييل في الشرح :-bd
وقمت بكل الخطوات .. وعندما اضغط حفظ النموذج ظهر لي خطاء في نهاية الكود .. استغنيت عن الخطوة الاخيرة خطوة الايقونة لكن ظهرت رسالة الخطاء مرة ثانية كالتالي
حدث خطأ أثناء تحليل XML، في السطر 2780، العمود 133: The element type "head" must be terminated by the matching end-tag "</head>".
ماذا افعل ..؟! =(
*على فكرة حولت رسالة الخطاء في محول الاكواد لديك .. لانها لا يمكن قبول html
وشكراً ^^"
في الاغلب انتي شايلة تاغ ال
</head>
راسليني عبر فيس بوك وارسليلي القالب وانا بعملو
fb.com/abdallhadagga
رمضان مبارك وعيد سعيييد ^_^
ولكني لا املك حساب على الفيس بوك هل من طريقة تواصل اخرى :)
ممكن نتواصل بالايميل
abdallhadagga@gmail.com
محول الأكوادالابتسامات