468x60 Ads

تعريب قوالب بلوجر

Monday 4 February 2013

إضافة تعدد تغيير الألوان أثناء وضع سهم الفأرة فوق رابط ما ببلوجر

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

سأقدم لكم خدعة رائعة بمدونات بلوجر
أثناء تصفحي لأحد المواقع الأجنبية الخاصة بمدونات بلوجر
وجدت هده الإضافة الرائعة التي لا طالما أردت إضافتها لمدونتي
حيث كنت أراها كثيرا بأحد المنتديات الكبرى
ألا وهي

 تعدد تغيير الألوان أثناء وضع سهم الفأرة فوق رابط ما

صورة الإضافة

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

لمعابنة الخدعة او الإضافة ضع مؤشر الماوس على الرابط أسفله


كفى كلاما وهيا إلى الشرح البسيط جدا

إدهب إلى

Template>Edit HTML

وبدون الضغط على توسيع القوالب

إبحث مستعملا Ctrl+F على

<head>

 ثم ضع بداخله او أسفله الكود التالي

<script type='text/javascript'>
//<![CDATA[
var rate = 20;
if (document.getElementById)
window.onerror=new Function("return true")
var objActive;  // The object which event occured in
var act = 0;    // Flag during the action
var elmH = 0;   // Hue
var elmS = 128; // Saturation
var elmV = 255; // Value
var clrOrg;     // A color before the change
var TimerID;    // Timer ID
if (document.all) {
document.onmouseover = doRainbowAnchor;
document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
document.onmouseover = Mozilla_doRainbowAnchor;
document.onmouseout = Mozilla_stopRainbowAnchor;
}
function doRainbow(obj)
{
if (act == 0) {
act = 1;
if (obj)
objActive = obj;
else
objActive = event.srcElement;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
function stopRainbow()
{
if (act) {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
function doRainbowAnchor()
{
if (act == 0) {
var obj = event.srcElement;
while (obj.tagName != 'A' && obj.tagName != 'BODY') {
obj = obj.parentElement;
if (obj.tagName == 'A' || obj.tagName == 'BODY')
break;
}
if (obj.tagName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function stopRainbowAnchor()
{
if (act) {
if (objActive.tagName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function Mozilla_doRainbowAnchor(e)
{
if (act == 0) {
obj = e.target;
while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
obj = obj.parentNode;
if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
break;
}
if (obj.nodeName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = obj.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function Mozilla_stopRainbowAnchor(e)
{
if (act) {
if (objActive.nodeName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function ChangeColor()
{
objActive.style.color = makeColor();
}
function makeColor()
{
// Don't you think Color Gamut to look like Rainbow?
// HSVtoRGB
if (elmS == 0) {
elmR = elmV;    elmG = elmV;    elmB = elmV;
}
else {
t1 = elmV;
t2 = (255 - elmS) * elmV / 255;
t3 = elmH % 60;
t3 = (t1 - t2) * t3 / 60;
if (elmH < 60) {
elmR = t1;  elmB = t2;  elmG = t2 + t3;
}
else if (elmH < 120) {
elmG = t1;  elmB = t2;  elmR = t1 - t3;
}
else if (elmH < 180) {
elmG = t1;  elmR = t2;  elmB = t2 + t3;
}
else if (elmH < 240) {
elmB = t1;  elmR = t2;  elmG = t1 - t3;
}
else if (elmH < 300) {
elmB = t1;  elmG = t2;  elmR = t2 + t3;
}
else if (elmH < 360) {
elmR = t1;  elmG = t2;  elmB = t1 - t3;
}
else {
elmR = 0;   elmG = 0;   elmB = 0;
}
}
elmR = Math.floor(elmR).toString(16);
elmG = Math.floor(elmG).toString(16);
elmB = Math.floor(elmB).toString(16);
if (elmR.length == 1)    elmR = "0" + elmR;
if (elmG.length == 1)    elmG = "0" + elmG;
if (elmB.length == 1)    elmB = "0" + elmB;
elmH = elmH + rate;
if (elmH >= 360)
elmH = 0;
return '#' + elmR + elmG + elmB;
}
//]]>
</script>

ثم قم بحفظ القالب ومبروك عليك الإضافة/الخدعة

وكلمة شكر تكفي

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

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

أقدم لكم طريقة من أسهل الطرق
لإضافة صندوف المعجبين فيسبوك لمدونات بلوجر
 فقط عبر إضافة أداة
والجميل انه بتقنية الجيوكيري ولا يأخد مساحة كبيرة من مدونتك
حيث تزيد من جمالية مدونتك
كما تعتبر هده الإضافة من أهم الإضافات بالمدونات لرقي بها وإشهارها عبر زر الإعجاب أو النشر

صورة الإضافة


لمعيانة الإضافة


شرح الإضافة

فقط عبر إضافة اداة من تخطيط أو Layout
قم بإدخال الكود التالي

<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".noopslikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.noopslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh99FBIHgPC0Kb0D8Chz7GU-c13_DO9vXN_GPHs7Qj0_OwXU4sjHtlaxnmVGjMGahbenpop47Vbvr4vMEjoCCFUwYMJ3Z4CPUYB8inKGL-nC7R9Je9S-wLYliM0_YZ-JDS2fyv1mvim08E/s1600/fb_static+button.jpg") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 999;position:fixed;right:-250px;top:20%;}
.noopslikebox div{border:none;position:relative;display:block;}
.noopslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 7px;text-align: right;z-index: 999;}
.noopslikebox span a{color: gray;text-decoration:none;}
.noopslikebox span a:hover{text-decoration:underline;}
</style>
<div class="noopslikebox">
    <div>
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/NetOops-Blog/159796530791611&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe>
    </div>
</div>

للتعديل على الكود
غير رابط صفحتك كلها برابط صفحة مدونتي على الفيسبوك
فقط غير ما باللون الأحمر
إي إسم صفحتك على الفيسبوك متبوعا ب / ثم برقم المعرف Fb_ID

ومبروك عليكم الإضافة
Enjoy

إضافة الإبتسامات المتحركة الإصدار الثاني لمدونات بلوجر

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

أقدم لكم من جديد

 إضافة الإبتسامات المتحركة الإصدار الثاني لمدونات بلوجر

إد أن هذه الإضافة ستعمل بالنسبة للأشخاص الدين لم تعمل لديهم

إضافة الإصدار الاول وهدا حسب اختلاف الأكواد في بعض القوالب

كمثال انا قالبي رفض الجزء الأول من أيقونات الإبتسامات ولم تشتغل عندي

مع ان هذا الإصدار أي الثاني إشتغل وبدون أي أمشاكل

صورة الإضافة


شرح الإضافة

إذهب إلى

Template -> Edit HTML [click Proceed]

ثم قم بالبحث عن الكود الثالي عبر الضغط على Ctrl+F
]]></b:skin>

وأضف قبله هذا الكود
img.bhacksmly {
    height: auto !important;
    vertical-align: middle !important;
    width: auto !important;
    border:0px !important;
}

ثم إبحث عن
</body>

وأضف قبله الكود التالي
<script src='https://netoopscodes.googlecode.com/svn/branches/Js files/ysmiley threaded comments-min.js' type='text/javascript'/>

واخيرا قم بالبحث عن هدا الكود

ولاتنسى ان تكون قد علمت على توسيع القوالب
<div class='post-footer-line post-footer-line-3'>

ستجد بعده هذا الكود
</b:includable>


مثال
</div>
.
ستضع الكود أسفله الخاص بالإبتسامات بين الوسمين

</b:includable>  

أي ان الكود التالي سيكون بعد
 </div>

وقبل
</b:includable>

أي بينهم كما هو موضح في المثال

وهذا هو الكود الخاص بالإبتسامات

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='netoopsblogysmile' id='ysmile' style='

background: -moz-linear-gradient(top, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e4f5fc), color-stop(50%,#bfe8f9), color-stop(51%,#9fd8ef), color-stop(100%,#2ab0ed));background: -webkit-linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);background: -o-linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);background: -ms-linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);background: linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);border-radius: 3px;width:100%; padding:10px; height:65px;'>

<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/> :)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/> :(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/> ;)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/> :D
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/> :-/
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/> :x
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/> :P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/> :-*
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/> =((
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/> :-O
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/> X(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif'/> :7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif'/> B-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif'/> #:-S
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/> :((
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/> :))
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/> =))
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif'/> :-B
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/101.gif'/> :-c
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/> :)]
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/> ~X(
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/103.gif'/> :-h
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/28.gif'/> I-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/41.gif'/> =D7
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/43.gif'/> @-)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/45.gif'/> :-w
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/47.gif'/> 7:P
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/48.gif'/> 2):)
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/110.gif'/> :!!
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/111.gif'/> \m/
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif'/> :-q
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/113.gif'/> :-bd
<img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/114.gif'/> ^#(^
</div><a href="http://netoopsblog.blogspot.com"></a></b:if>

قم بحفظ القالب

ومبروك عليك الإضافة

أي استفسار ضعه بتعليق وكلمة شكر تكفي

شرح استبدال رسائل أقدم وأحدث بمواضيع المدونة بمدونات بلوجر

السلام عليكم ورحمة الله تعالى وبركاته
اليوم وبإدن الله
سأقدم لكم إضافة جميلة وبأسهل الطرق فقط عبر إضافة أداة
حيث سيصبح بدل
رسائل أقدم وأحدث مواضيع المدونة
وهذه الإضافة كالتي ببعض المنتديات
حيث ان البعض يشاهدها ابالمنتديات ويرجوا ان يجد موضوع لإضافتها ببلوجر
ها انا اليوم أتيت بها إليكم

صورة الإضافة

شرح الإضافة كالتالي

إذهب إلى
Dashboard >> Layout>> Add cadgets >> HTMLJavaScript
ثم أضف الكود التالي
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" h3:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link:first").text();
$("a.blog-pager-older-link").text(olderLinkTitle);
});
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" h3:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link:first").text();
$("a.blog-pager-newer-link").text(newerLinkTitle);
});
</script>
ومبروك عليك الإضافة ماعليك سوى وضعها تحت Post

كالصورة أسفله


ثم إعمل حفظ الترتيب
وهكذا انتهينا من الإضافة
تعليقاتكم تهمنا فلا تبخلوا علينا بتعليقاتكم

كيف تصلح عدد التدوينات في صحفة التصنيفات كالعدد بالصفحة الرئيسية في بلوجر

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

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



بدون هذا التعديل، الروابط تظهر بشكل مباشر مما يجعلها هكذا:

http://arabetutorial.blogspot.com/search/label/XXXXX

وعند ضغط الزائر على أحد التسميات ولنفترض ان المدونة قديمة ومملوئة بالتدوينات
حيث ان محتوى أحد التسميات 100 تدوينة
فقبل التعديلالذي سنلجا إليهستظهر كل التدوينات المئة في صفحة واحدة
وهذا سيجعل المتصفح يحمل الصفحة لمدة طويلة جدا
كما أن الزائر سيلجا بالفرار هاربا من تلك المشكلة العويصة
إلى ان حلها أبسط مما تتخيلون

أرى اني أكثرت كلاما لكن فقط للتوضيح مدى اهمية هذه الطريقة

لكن لاحظ بعد هذا التعديل ان شاء الله، سوف تظهر بهذا الشكل:
http://arabetutorial.blogspot.com/search/label/XXXXX&max-results=6
كما لاحظتم مجرد 12 حرفا هي حل لأكبر مشاكل المدونات

 &max-results=6

انا وكما في مدونتي وضعت رقم 6 وهو يعني عدد التدوينات في صفحة احد التصنيفات
للمعاينة ادخل من هنا

ستلاحظ أنها 6 تدوينات فقط

شرح الطريقة

  اولا كما العادة اذهب الى لوحة التحكم، قالب، تحرير HTML، ضع علامة في خانة توسيع عناصر واجهة المستخدم.
  بعد ذلك، ابحث عن الكود التالي:
expr:href='data:label.url'
و استبدله بالكود التالي:
expr:href='data:label.url + "?max-results=6"'


كما يمكنك تغيير رقم 6 بأي رقم تريد
لكن انصحكم بأن لاتزيدوا عن 10 تدوينات بالصفحة لكي لا تقل أرشفة مدونتكم

انهينا، و هكذا نكون قد تغلبنا على مشكل اخر في بلوجر، الى اللقاء