حصريا اضافة طي الصفحة وظهور زر rss

بسم الله الرحمن الرحيم

السلام عليكم ورحمة الله وبركاته

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

لنبدأ على بركة الله :

الخطوة الاولى:

اولا نتجه الى هنا : Layout -> Edit HTML

ثم نبحث عن :

</head>

ونلصق قبلها الكود التالي :

<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLO0d3uqnkA6pVzaYqm7rQMcYOm42HUzFVrPJThu4ovED_r3ONkEGC_3-Ym_KjBuWW8cvzR193eVBKjhJghevRt6UgFGEF_P5Oh0tvWF0T6Knk9xZrqZTfhKy9sanQZdVPJt5A-zu94ldL/s1600/rss.png) no-repeat right top;
}
</style>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Page Flip on hover

$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});


});
</script>

الخطوة الثانية :

هي البحث عن :

<body>

ثم نضيف قبلها

<div id='pageflip'><a href='your rss'><img alt='' src='http://www.wallheaven.com/page_flip.png'/></a><div class='msg_block'></div></div>

ثم غير your rss برابط rss ألخاص بمدونتك

ثم اضغط

Save Template

0 التعليقات:

إرسال تعليق

اتبعني

التدوينات RSS

فيس بوك

برامج تهمك

الاقسام

المتابعون

مختارات القراء لهذا الشهر

اشتراك في القائمة البريدية

مدونة معلومة