+ + + + +
Share/Save/Bookmark

2008-10-25

مواضيع ذات صلة





باختصار وكما يشير العنوان

طريقة جديدة وظيفتها ادراج المواضيع ذات الصلة بعد الانتهاء من البوست
* تذكر ان تاخذ نسخة احتياطية من القالب قبل البدء
1- اذهب الى صندوق الاكواد
dashboard > template > layout > editHTML
واضغط على المربع الصغير اللى اللى اسمه
Expand Widget Templates
2- ابحث عن
<data:post.body/>

وفى السطر التالى لهذا السطر اضف القطعة التالية


<b:if cond='data:blog.pageType == "item"'>
<div class='similar'>
<div class='widget-content'>
<h3>مواضيع ذات صلة</h3>
<div id='data2007'/><br/><br/>
<div id='hoctro'>
</div>
<script type='text/javascript'>



var homeUrl3 = "<data:blog.homepageUrl/>";
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;


maxNumberOfPostsPerLabel = 100;
maxNumberOfLabels = 3;


function listEntries10(json) {
var ul = document.createElement('ul');
var maxPosts = (json.feed.entry.length <= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i < maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;


for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement('li');
var a = document.createElement('a');
a.href = alturl;


if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l < json.feed.link.length; l++) {
if (json.feed.link[l].rel == 'alternate') {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k<20; k++) label = label.replace("%20", " ");
var txt = document.createTextNode(label);
var h = document.createElement('b');
h.appendChild(txt);
var div1 = document.createElement('div');
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById('data2007').appendChild(div1);
}
}
}
function search10(query, label) {


var script = document.createElement('script');
script.setAttribute('src', query + 'feeds/posts/default/-/'
+ label +
'?alt=json-in-script&callback=listEntries10');
script.setAttribute('type', 'text/javascript');
document.documentElement.firstChild.appendChild(script);
}


var labelArray = new Array();
var numLabel = 0;


<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>


</div>
</b:if>


3- احفظ , بس



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-09-11

Link List متمددة



باختصار : طريقة عمل قطعة روابط زى الموجودة هنا فى المدونة , اللى اسمها " الفهرس " على ايدك اليمين


<b:widget id='LinkList50' locked='false' title='List Title' type='LinkList'>
<b:includable id='main'>
<script type='text/javascript'>
//<![CDATA[
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a href="#" onclick="tmp = document.getElementById("' + rnd + '"); tmp.style.display = (tmp.style.display == "none") ? "block" : "none"; return false;">');
//]]>
</script>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<script type='text/javascript'>
//<![CDATA[
document.write('<\/a>');
//]]>
</script>
<div class='widget-content'>
<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<script type='text/javascript'>
//<![CDATA[
document.write('<\/div>');
//]]>
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>



ولو عايز القطعة تظهر وتختفى من خلال الضغط على علامة ( +/- )



<b:widget id='LinkList50' locked='false' title='List Title' type='LinkList'>
<b:includable id='main'>
<script type='text/javascript'>
//<![CDATA[
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a href="#" onclick="tmp = document.getElementById("' + rnd + '"); tmp.style.display = (tmp.style.display == "none") ? "block" : "none"; return false;" style="float:left;margin-right:5px;">[+/-]<\/a>');
//]]>
</script>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<script type='text/javascript'>
//<![CDATA[
document.write('<\/div>');
//]]>
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>






طريقة الاضافة : بعد الانتهاء من تخصيص الكود , روح لصندوق الاكواد انزل تحت هاتلاقى القطع بتاعتك شكلها زى كده , مثلا


<b:widget id='HTML3' locked='false' title='Posts' type='HTML'/>
<b:widget id='LinkList1' locked='false' title='فهرس الدروس' type='LinkList'/>
<b:widget id='HTML7' locked='false' title='' type='HTML'/>
<b:widget id='HTML5' locked='false' title='رابط المدونة' type='HTML'/>
<b:widget id='HTML11' locked='false' title='ضع ايميلك لتصلك اخر المواضيع' type='HTML'/>
<b:widget id='HTML6' locked='false' title='كلمنى لو اونلاين' type='HTML'/>



هاتضع انت كود القطعة بالكامل بين احدى تلك القطع , مثلا


<b:widget id='HTML3' locked='false' title='Posts' type='HTML'/>
<b:widget id='LinkList1' locked='false' title='فهرس الدروس' type='LinkList'/>
<b:widget id='HTML7' locked='false' title='' type='HTML'/>


ضع كل الكود هنا فى السطر ده

<b:widget id='HTML5' locked='false' title='رابط المدونة' type='HTML'/>
<b:widget id='HTML11' locked='false' title='ضع ايميلك لتصلك اخر المواضيع' type='HTML'/>
<b:widget id='HTML6' locked='false' title='كلمنى لو اونلاين' type='HTML'/>


وبعدين تحفظ

ملاحظة مهمة جدا : لو ناوى تحط اكثر قطعة من النوع ده , لازم تغير الآى دى "id" قبل الاضافة , هنا الآى دى "LinkList50" مكتوبه باللون البحلقى ده فوق , ولازم تغيره تخليه مثلا LinkList55 او LinkList66 براحتك .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

تمييز تعليقك عن تعليق الزائرين !!



ملاحظة : تم التحديث نظرا لبعض الشكاوى من عدم فعالية الطريقة , وهذا نظرا لاختلاف بعض القوالب الجاهزة من حيث التصميم والاكواد , تم التحديث بتاريخ : 22/12/2009

طريقة جديدة تقدر بيها تميز تعليقك من بين تعليقات الزائرين الكتييييييرة جدا , ده لو كنت من اصحاب المدونات الشهيرة لا سمح الله او كان نظرك ضعيف فمش بتقدر تشوف تعليقك , او اى سبب تانى , المهم
ادخل المدونة
روح على صندوق الاكواد ومساره كالتالى
dashboard > template > layout > editHTML او ما يقابله باللغة العربية
اضغط على البوكس الصغير اسمه
Expand Widget Templates

ابحث عن الاكواد الخاصة بالتعليقات ( هاتلاقي الفترة الخاصة بالتعليقات اسمها comments غالبا ) وضف لها القطعة التالية فى المكان المناسب


.author-comments {
background: #CC3300;
border: 2px solid #666666;
padding: 5px;
}


وبعد كده ابحث عن الكود التالى باللون الاخضر , وضيف اليه القطع المكتوبة باللون الاحمر



<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
said...
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='author-comments'>
<p><data:comment.body/></p>
</dd>
<b:else/>

<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>

</b:if>

<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:
comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>




وطبعا ممكن تغيركود اللون باى كود لون اخر ( ممكن تدور هنا ) . او تضيف بعض الخصائص من عندك .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

قطعة : ابعتلى احدث المواضيع



قطعة : ابعث لى باحدث المواضيع ( كما بالمدونة هنا ) ووظيفتها اتاحة الفرصة للزوار لمتابعة احدث تدويناتك عن طريق الاشتراك من خلالها .
والجدير بالذكر ان هناك الكثير من المواقع التى تقوم بخدمة التغذية المرتجعة " feed " مثل " feedburner " وهو من أشهرهم .
لكن تلك القطعة الموضحة هنا سيقوم بانشاءها لنا موقع اخر هو
feedblitz , وقمت باختياره لسهولته .
الخطوات سهلة جدا
ادخل
هـــنـــا
هاتلاقى خانتين
اكتب فى الاولى ايميلك
وفى الثانية الرمز الموجود بالصورة
وبعدين اضغط على الزرار اللى اسمه
Install Your Email Subscription Widget on Blogger
وهاينقلك فورا لاضافة القطعة من موقع البلوجر

* * * * *
جدير بالذكر ايضا ان بلوجر عملت خاصية جديده اسمها خاصية التتبع following تقدر من خلالها تتبع اى مدونة تعجبك , لسه الى الان لم تدعم دعم كامل بجميع المدونات لكن قريبا ستراها فى مدونتك ان لم تكن موجوده بالفعل الان .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-08-27

أسئلة الضيوف 2




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

وكل عام وأنتم بخير جميعا



نظرا لان البوست بتاع " اسئلة الضيوف " كبر جدا وزاد عن الـ 110 تعليق ف عين العدو , وأكيد هايكون سبب فى تهنيج أنترنتكسبلوراتكم أو فايرفوكساتكم او أوبراتكم أو أياَ كانت متصفحاتكم إكـُم إكـُم , عشان كده البوست ده كجزء تانى , هنكمل فيه الاسئلة , التعليقات اتقفلت هناك ومفتوحة هنا طبعا ( بنفس الشروط المتفق عليها فى الموضوع الاول واهمها ان الاسئلة تكون غير متعلقة باى درس مشروح هنا , اما لو بخصوص موضوع معين فياريت تحط سؤالك فى نفس الموضوع ) .

بالمناسبة : نظرا برضو لان نظام التعليق الجديد " من أسفل البوست " لا توجد به خدمة تتبع التعليقات , فلو عايز تتبع التعليقات هاتستخدم نظام التعليق القديم بأنك تضغط على كلمة " اضف تعليقك " او " post comment " اللى موجودة تحت كل بوست مباشرة , وهاتنقلك للصفحة الكلاسيكية بتاعة التعليقات . لذا وجب التنبيه والتنويه .

وأمنياتى للجميع بدوام الصحة والإسكان D:


تحديث : التعليقات اتقفلت هنا , هانكمل فى البوست ده اسئلة الضيوف 3



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-08-10

التعليق من اسفل البوست



اخيرا عملت بلوجر نظام التعليق السلس من نفس الصفحة اسفل كل تدوينة زى مدونات الووردبريس بالظبط
وتقدر تنفذها بكل سهولة
1- ادخل
هـــــنـــــا وسجل دخولك
2- اذهب الى setting و بعدها comments وغير Comment Form Placement خليها Embedded below post
3- احفظ save

اذهب الى مدونتك و اتاكد ان صندوق التعليقات ظهر تحت البوست
لو مكنش ظهر كمل الخطوات التالية
4-فى مد ونتك اذهب الى Layout "تخطيط" ثم edit html"تحرير هتمل"
5-علم على المربع الصغير اللى اسمه Expand widget templates
6-ابحث عن

<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</p>
</b:if>



وبدلها بـــ

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/> <b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>
</b:if> </b:if> </p> </b:if>



واحفظ :)



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-06-12

اعلان هام




تم بحمد الله افتتاح
مدونة للقوالب
تضم تقريبا كل القوالب اللى عالويب .
ادخل وخد اللى انت عايزه



انتبة : قبل تركيب قالب جدبد
1- خذ نسخة احتياطية من القالب القديم download full template واحفظها على الهارد لديك تحسبا لاى ظروف
2- فيه نوعين من القوالب : الاول النوع الحديث " modern " او " xml " , والنوع الثانى القديم " الكلاسيك classic " .
فلو نظامك قديم وحاولت تركب قالب حديث هاتطلعلك رسالة خطأ , ولازم تحول نظامك الى النظام الحديث اولا ubgrade to modern mode ثم تشغيل القالب الحديث بعد كده .
ولو نظامك حديث وعاوز تركب قالب كلاسيك فلازم ترجع النظام الى النظام القديم اولا convert to classic . ولو انى لا افضل النظام القديم
3- كل القطع هاتعرض للحذف - القطع كالبروفايل وخلافه وليس البوستات - بعد تشغيل القالب الجديد .
روابط تهمك قبل البدء :
كيفية الحفاظ على القطع من الحذف من
هــــنــا او من هـــنـــا
التحويل من الظام القديم للنظام الحديث من
هـــنـــا
مركز مساعدة البلوجرز من
هــــــــنــــــا






الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-05-22

انشاء بوستات متمددة


هذا الشرح مخصص لاصحاب القوالب المودرن xml فقط . وبعد تنفيذ الحطوات بشكل سليم ستصبح تدويناتك بها امكانية التمدد عن الضغط على " اقرا المزيد ... " فى نفس الصفحة , كما فى هذه التدوينة



الخطوات :

1- خذ نسخة احتياطية من القالب تحسبا لاى ظروف download full template واحفظها على الهارد .

2- اذهب الى صندوق الاكواد dashboard > template > layout > editHtml ثم اضغط على المربع Expand Widget Templates الموجود مباشرة فوق صندوق الاكواد لكى تتمدد وتراها بالشكل الحقيقى .

3- ابحث عن </head> , ثم اضف قطعة الاكواد التالية "جافا سكريبت" فى السطر السابق لها
كود الجافا سكريبت من هـــــنــــا



4- ابحث فى القالب عن includable id='post' , ثم احدث التغيرات الموجوده فى هذه الصفحة الملونة باللون الاحمر . او قم بنسخ القطعة كاملة ولصقها فى المكان الملائم بالتحديد وبدقة , تعامل بحذر .
ملحوظة : فى هذا الملف ستجد جملتى Summary only... و Read More... يمكنك ان تبدلها بالرموز التى تناسبك , انا ابدلتهم بـ ( اخفاء ) و ( اقرأ المزيد ) .


5- اذهب الى خيارات المدونة setting ثم formatting "تهيئة" , ستجد صندوق نصى بعنوان "Post template" ( او مايقابله باللغة العربية لو كانت مدونتك معربة ) , انسخ فيه تلك القطعة الملونة باللون الاحمر كاااملة , ثم احفظ .

هنا بداية البوست
<span id="fullpost">
هنا بقية البوست
</span>



6- الان عند انشاء بوست جديد انتقل الى وضع الـ editHtml , ستجده بهذا الشكل




اضغط على الصورة لتراها بشكلها الحقيقى



اكتب انت بداية البوست فى المكان المحدد , وبقية البوست المختفى فى المكان المحدد ايضا .

7- اخبرنى بالنتيجة (:

8- ملحوظة مهمة جدا : يجب ان تعرف ان كود span يستخدم فى التحكم بلون وحجم الخط عند استعمالك لوضع compose , وحيث ان هذا الكود يحتاج الى غلق بهذا الشكل /span فستجد ان اكواد الغلق الخاصة بالخط ستتعارض مع كود " التمدد " الذى اضفناه فى الخطوة رقم 5 , لذلك يجب عليك ان تتعامل مع الوضع editHtml بحرفية اكثر , بحيث تكون اقسام البوست divisions داخل كودى span و /span . بهذا الشكل .


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


© © © © ©




الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-05-20

اسئلة الضيوف


هذه التدوينة مخصصة للاسئلة بخصوص البلوجرز , او حول الـ css او الـ html او الـ xml , او اى اسئله اخرى ليس لها علاقة باى موضوع من المواضيع المشروحة , ضع سؤالك فى التعليقات على هذه التدوينة , وسيتم الاجابة عليه فى اقرب فرصة مدعومة بالصور لو لزم الامر . اما اذا كان استفسارك يخص اى موضوع مشروح بالفعل , فرجاءا ترك السؤال فى تعليق فى الموضوع المحدد , ورجاء اخر استخدم لينك خاص بك اثناء التعليق , سواء ايميل او مدونة او موقع لسهولة الاتصال , وابتعد عن " غير معرف " او مجرد اسم بلا عنوان ,ورجاء اخير الاعلام بالنتيجة بعد كل اجابة , وشكرا لتعاون الجميع .
سيتم ادراج كل الاسئلة واجاباتها هنا فى البوست للمزيد من التسهيل والايضاح ولكى يستفيد منها الجميع .


__________________________________



At 01 أبريل, 2008 05:04 م ابو بدر said...


اخي العزيز وائل

السلام عليكم
لدي إستفسار ارجو ان تجيبني عليه وهو أن مدونتي تظهر عليها علامة التعديل التي على شكل مفتاح برغي سواء تم الدخول عليها عن طريق المعرف الخاص بي أو حتى بدون المعرف بمعني لو انك انت الآن دخلت عليها سوف ترى هذه العلامة وقد وضحتها لك بالصور في الرابط المرفق ..
ماأفعل لأجعل هذه العلامة لا تظهر لكل الزوار والمشاهدين يبدو انني عملت حاجة غلط فضلا إذا كنت تعرف الحل فلا تبخل علي..
أخوك أبو بدر
وهذا رابط الصورة..
http://almasken.googlepages.com/jpg


________________


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

بسيطة ,هاتدخل لصفحة عناصر المدونة
متبعا هذا المسار او ما يقابله باللغة العربية لو كانت مدونتك معربة


اضغط على edit
الموجودة اسفل " الاطار الرئيسى " اللى فيه التدوينات .
هاتظهرلك صفحة فيها الادوات اللى بتظهر اسفل كل تدوينة
احذف علامة " صح " من اداة التحرير اللى مدايقاك وهايكون اسمها :

. واحفظ


على فكرة ده " قلم رصاص " مش " مفتاح برغى " بالمناسبة (:

__________________


At 01 أبريل, 2008 05:16 م المدير العام said...

الأخ وائل..
السلام عليكم و رحمة الله و بركاته..
لا اخفي عنك انني وصلت عن طريق الصدفة الى مدونتك الاكثر من رائعة عن طريق عمليات البحث على جوجل.. و تعلمت كثيرا من مدونتك الى ان اتممت بناء مدونتي engineer-it.blogspot.com حتى ان وصلت للشكل الذي هي عليه الآن.
سؤالي لك لو سمحت :
اريد ان افصل بين التدوينات بصورة تتكرر بين كل تدوينة و اخرى اسوة بهذه المدونة keesfeshar.blogspot.com و ذلك باستخدام القالب العادي الذي استخدمه في مدونتي الآن بدون اضافة قالب جديد فما هو الحل برايك؟؟
كما انني اود ان اضيف فواصل بين الويدجيت الموجودة في السايد بار فهل من طريقة لذلك.؟؟
كما ارجو اخيرا أن تعلمني برايك الشخصي بمدونتي للاستفادة من خبرتك في هذا المجال و كيف السبيل الى زيادة عدد زوار المدونة فأنا اعاني شحا ً في الترافيك.. و لك جزيل الشكر و الامتنان

________________



المدير العام :

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

الفصل بين التدوينات :

فى صندوق الاكواد الخاص بك

ابحث عن القطعة التى تحتوى على اكواد " التدوينة " واسمها

.post {



من ضمن الاوسمة التى توجد بتلك القطعة وسم البوردر " border " بهذا الشكل

border-bottom: 3px solid #f7e8d8;



طبعا كل القيم اللى موجوده هنا كمثال فقط , يمكنك تغييرها , والوسم ده هايقوم بانشاء " خط " سمكه 3 بيكسل بين كل تدوينة والاخرى , ممكن تستعمل صورة بيدل " الخط " لو عايز . بس الكود هايتغير وهايبقا بالشكل ده :

border-bottom: url(لينك الصورة هنا);



لو كان الوسم موجود بالفعل غير قيمته من " صفر " الى قيمة صحيحه , ولو مكنش موجود انسخه انت ضمن اوسمة هذه القطعة اللى اسمها مرة تانية :

.post {



اما اذا كانت القطعة كلها مش موجوده
اعملها بنفسك

.post {
padding: 0;
border-bottom: 3px solid #f7e8d8;
}



________________


اما مسالة الفواصل بين الويدجات فالاسهل تعمل " خط " اسفل اكواد كل ويدجيت على حده , ادخل اى ودجيت واعمله " تحرير " مثلا , وانزل تحت اكتب :


<br> ـ ـ ـ ـ ـ ـ ـ ـ ـ ـ <br>




هاتلاقيه عمل خط

________________


بخصوص زيادة الترافيك , اهم شئ : المحتوى ثم المحتوى ثم المحتوى ثم المحتوى ....
بعد كده استخدم طرق الاعلان عن المدونة
وشارك فى مدونات الاخرين بشكل كبير
وضع روابطهم عندك, واسالهم انهم يضعوا رابطك عندهم . دى اهم حاجات ف رايى



اتمنى اكون افتدتك :)

---------------------

At 14 أبريل, 2008 04:23 م أحمد علي said...

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



------------------

أحمد على :
بخصوص الترجمة الى لغات اخرى غير الانجليزية :
يمكنك استعمال الكود التالى :


<form action="http://www.google.com/translate" >

<script language="JavaScript">
<!--
document.write ("<input name=u value="+location.href+" type=hidden>")
// -->
</script>

<input name="hl" value="en" type="hidden">

<input name="ie" value="UTF8" type="hidden">

<input name="langpair" value="" type="hidden">

<input name="langpair" value="enfr" title="French" src= "http://photos1.blogger.com/img/43/1633/320/13539949_e76af75976.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair" value="ende" title="German" src= "http://photos1.blogger.com/img/43/1633/320/13539933_041ca1eda2.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair" value="enit" title="Italian" src= "http://photos1.blogger.com/img/43/1633/320/13539953_0384ccecf9.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair" value="enpt" title="Portuguese" src= "http://photos1.blogger.com/img/43/1633/320/13539966_0d09b410b5.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair" value="enes" title="Spanish" src= "http://photos1.blogger.com/img/43/1633/320/13539946_2fabed0dbf.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair" value="enja" title="Japanese" src= "http://photos1.blogger.com/img/43/1633/320/13539955_925e6683c8.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair" value="enko" title="Korean" src= "http://photos1.blogger.com/img/43/1633/320/13539958_3c3b482c95.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair" value="enzh-CN" title="Chinese Simplified" src= "http://photos1.blogger.com/img/43/1633/320/14324441_5ca5ce3423.jpg" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30">

<input name="langpair2" value="enar" title="Arabic" src= "http://photos1.blogger.com/blogger/3709/485/1600/arabic-flag.gif" onclick="this.form.langpair.value=this.value" height="20" type="image" width="30" />
</form>


هاتنشأ اداه من النوع Html/Java script وتنسخ فيها الكود وتحفظ .

او بطريقة اسهل انك تدخل الصفحة دى
هــــنـــا , وتنشأ قطعة جاهزة من جوجل فى مدونتك بانك تدوس على زرار Get widget .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

انشاء قائمة روابط منزلقة



كيفية انشاء قائمة روابط منزلقة :

سهلة جدا , اذهب واصنع اداه add a page element من صفحة عناصر مدونتك , واختار html/java script " هتمل جافا سكريبت " ثم انسخ فيها هذا الكود بعد ان تخصصه حسب احتياجك وحسب الروابط الخاصة بك

الشكل الاول : الروابط ستفتح مباشرة عند الضغط عليها فى نفس النافذة :

<form>
<select onChange="location=this.options[this.selectedIndex].value;">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
</form>

او هذا الكود اذا اردت ان تفتح الروابط فى نافذه جديده :

<form>
<select onChange="PopUpName=window.open('','PopUpName');PopUpName.location=this.options[this.selectedIndex].value;">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
</form>


مثال للشكل الاول :






------------------------

الشكل الثانى : الروابط ستفتح عند الضغط على زرار " اذهب " فى نفس النافذة , كما فى المثال

<form>
<select name="menu">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
<input type="button" onClick="location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO">
</form>

او هذا الكود اذا اردت ان تفتح الروابط فى نافذة جديده :

<form>
<select name="menu">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
<input type="button" onClick="PopUpName=window.open('','PopUpName');PopUpName.location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO">
</form>

مثال للشكل الثانى:









--------------------

تخصيص الروابط :

فى الامثلة السابقة يوجد رابطين فقط لموقعى msn و google , لاحظ ان اسماء المواقع باللون الاحمر بينما رابط المواقع باللون الازرق , اذا اردت ان تضيف عددا اكبر كل ماعليك انك تكرر تلك السطور , مثال


<form>
<select name="menu">
<option value="رابط اللينك الاول">اسم اللينك الاول</option>
<option value="رابط اللينك الثانى">اسم اللينك الثانى</option>
<option value="رابط اللينك الثالث">اسم اللينك الثالث</option>
<option value="رابط اللينك الرابع">اسم اللينك الرابع</option>
<option value="رابط اللينك الخامس">اسم اللينك الخامس</option>
</select>
<input type="button" onClick="PopUpName=window.open('','PopUpName');PopUpName.location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO">
</form>






الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-05-16

قطعة لتقييم تدويناتك


الان تستطيع اضافة قطعة كى يقوم الزائرون بتقييم تدويناتك من خلالها
للبدء فى انشاءها اتبعى معى

اذهب الى صندوق اكواد مدونتك عن طريق هذا المسار
dashboard > template > layout > edit html
فوق صندوق الاكواد مباشرة ستجد مربعى صغير اسمه Expand Widget Templates , علم عليه " اضغط عليه بالماوس " كى تتمدد اكواد القطع وتراها بصورتها الكاملة
الان ابحث فى صندوق الاكواد ( يمكنك البحث عن طريق crtl + f ) , ابحث عن

<data:post.body/>


تحت هذا السطر الموجود به تلك القطعة مباشرة , اضف تلك القطعة الاخرى :

<script language='JavaScript'>var OutbrainPermaLink='<data:post.url/>';var OB_demoMode = false;var OB_Script = true;</script><script src='http://widgets.outbrain.com/OutbrainRater.js' type='text/javascript'/>

واخيرا اضغط preview لترى النتيجة , ثم احفظ عملك , وادعيلى .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

ماهى افضل تدويناتك ؟


ملحوظة : تم التحديث والتعديل


هذه القطعة وظيفتها عرض اشهر او افضل التدوينات التى قمت انت بكتابتها فى مدونتك حسب عدد التعليقات والزيارات لتلك التدوينات على الترتيب .

للبدء فى انشاءها ابدأ معايا :

- اذهب الى هذا الموقع
the AideRSS homepage
- فى الصندوق اكتب اسم مدونتك بالشكل التالى
http://yourblog.blogspot.com/rss.xml

( استبدل كلمة yourblog باسم مدونتك )ثم اضغط analyse .
- انتظر حتى يتم التعرف على مدونتك وترتيب التدوينات حسب الاشهر , ستظهر لك ضفحة بهذا الشكل


- اضغط على كلمة Sharing and Widgets الموضحة فى الصورة
- فى الصفحة التالية سيظهر لك الكود بالجهة اليمنى , وشكل القطعة التى ستظهر بعد استخدام الكود فى الجهة اليسرى
- خذ الكود وضعه فى اداه html/java script فى مدونتك عن طريق " اضافة عنصر " add a page element من صفحة عناصر مدونتك , ثم احفظ .


تحديث :


واضح ان شكل الموقع اتغير شوية عن اللى فى الصورة

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


انك تدخل على اللينك التالى


Top Posts Widget


وتختار Get Widget الخاصة بBLOGGERبلوجر

وتكتب اسم مدونتك او اى مدونة او موقع فى الخانة
Specify your website address

وبعدين هاتلاقى الكود فى اسفل الصفحة

تاخده وتتعامل معاه طبيعى زى اللى فات

لذا وجب التنبيه



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

افضل المعلقين فى مدونتك


الان يمكنك اضافة قطعة وظيفتها اظهار اشهر المعلقين لديك فى المدونة عن طريق النموذج التالى




- الخانة الاولى ضع بها عنوان القطعة
- الخانة الثانية ضع بها رابط المدونة كما فى المثال
- الخانة الثالثة ضع بها اسمك الذى يظهر فى التعليقات الخاصة بك لكى يتم عدم ادراجه فى التقييم
- بعد ملأ الخانات اضغط customaize ثم add to blog ليتم انشاء القطعة .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-05-02

احمى مدونتك من السرقة




امسك حرامى

حينما يرى الزائر - صاحبنا الحرامى - تدوينتك الساحرة , فان اول شئ يتبادر الى ذهنه بعد ان يسيل على فمه اللعاب من فرط سحر مدونتك هو ضغطة بسيطة بالفأرة " كليكة يمين " ثم اختيار select all ثم copy , ثم يذهب متخفيا الى موقعه او مدونته ويعمل - هذا المجرم - past , هكذا بكل سهولة حتى بدون ذكر اسمك او عنوانك او حتى مقاس جزمتك .

حسنا ايها السارق لن تسطيع سرقتنا بعد الان , هل تسمع ؟
هل مجرد الـ copy والـ past هو افضل ما لديك ايها الشنقيط ؟
اذا لم تكن قادر على كتابة مواضيع مفيدة فلتذهب الى الجحيم تبا لشركة " تى اى داتا " التى جعلت المتسولون ببضع جنيهات زهيدة يمتلكون انترنت فى هذا الزمن السخيف

لقدا اخذتنى الجلالة , حسنا , كفى سبابا ونرجع للموضوع , كيف نمنع هؤلاء المتسولين ومرتزقة الانترنت من العبث بمدوناتنا وسرقة " ترهاتنا " الخاصه ؟
ترهاتنا التى خرجت من بين خلايا امخاخنا , ترهاتنا تلك التى سهرنا طويلا نعدها كى تصبح " ترهات " مفيدة بشكل او باخر , سؤال وجيه
ربما لان الاجابة بسيطة وليس سوى كود واحد فقط اتيت به اليوم , لذلك - وسامحونى - فانا احتاج ان املا الصفحة ببعض الهراء و " أمط " الموضوع بقدر ما استطيع و " ألط " - بضم اللام - ايضا , حتى لا تصبح تدويناتى فارغة المنظر بخلاف المحتوى .

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





ondragstart="return false" onselectstart="return false"




بهذة القطعة الساحرة تستطيع ان تمنع هؤلاء "الشناقيط" من العبث بأوبشن copy و past مرة اخرى .

كيف تستخدم الكود ؟:
اثناء تحرير التدوين , انقل الى الوضع Edit Html كما فى الصورة , الصق هذه القطعة فى المكان المناسب داخل كود <div> ,لمزيد من التفاصيل حول كيفية التعامل مع الوضع Edit Html اذهب الى هذا الموضوع " كيف تكتب باحتراف ؟ "
بهذه الطريقة لن يستطيع الزائر عمل select بالفارة على الـ divisions التى دعمتها انت بهذا الكود , ومن ثم لن يستطيع عمل copy .
حاول كده انك تعمل select على التدوينة دى او تنسخ الكلام ......... مش هاتقدر , ماتقدااااارش على راى محمد صبحى




اضغط على الصورة لتراها بالحجم الحقيقى
اضغط على الصورة لتراها بالحجم الحقيقى



مثال :

فى وضع الـ Edit Html




<div align="right" dir="rtl" ondragstart="return false" onselectstart="return false">

اكتب هنا تدوينتك

</div>




تتميز تلك الطريقة بانك تستطيع منع سرقة تدوينة واحدة , او قطعة نصية معينة, بل سطر واحد فقط لو اردت , بخلاف الطرق الاخرى التى تجعل تجعل المدونة بالكامل غير قابلة للنسخ , لو الطرق التى تمنع خاصية الـ right click للفأرة . وكلها طريق قديمة لم اشأ ان اذكرها هنا .

على اى حال هناك طرق ايضا للتحايل على تلك الحماية , وهناك " شناقيط " محترفون للاسف يعرفون من اين تؤكل الكتف , ومن اين تسرق المدونات , لكن على الاقل هى طريقة مثالية للحماية ضد " الشناقيط " المبتدئين , وتذكر تلك المقولة

" وظيفة القفل ليست الغلق , وانما ابقاء الرجل الأمين أمينا لاطول فترة ممكنة "

واخيرا , سلمنا الله واياكم من شر الشناقيط



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

2008-04-18

التعامل مع الصوتيات والمرئيات


نظرا لأن البعض يسأل عن كيفية اضافة المواد السمعية احبب ان اشرح بالتفصل الاكواد المتعلقة بهذة العملية .

اولا : صوت فى الخلفية يعمل اوتوماتيكيا:
-----------------------------------
قبل البدء اقول ان عمل صوت فى الخلفية يعمل بشكل تلقائى هو امر مزعج الى ابعد حد , حيث يستهلك السرعه ويشتت الانتباه ويتعب المعدة ويجبر الزائر على الاستماع رغما عن انفه , دعك من اجهزة اغلينا هى اجهزة متواضعه و " بتهنج من الاخر " , مما يجعل الزائر فى الاخير يغلق الصفحة مضطرا وحالفا بالله العظيم انه لن يعود مرة اخرى ولو كان ذلك على جثته .
المهم , اذا اردت ان تشل زائريك فاليك طريقة عمل صوت فى الخلفية :
اتبع هذا المسار :


dashbord > layout > template > page elements > add a page element


التى فى الاطار الجانبى , واختر اداة Html/Java script وضع فيها هذا الكود :


<embde src="رابط الملف الصوتى هنا بين علامتى التنصيص" autostart="true" loop="false" volume="100" hidden="true">


ضع رابط الملف الصوتى فى المكان المحدد الملون باللون الاحمر .
volume=100 : تحديد طبقة الصوت , ويمكنك تغيير القيمة .

loop=false : الملف لن يتكرر بعد انتهاء عرضه , يمكنك جعله يتكرر بابدال القيمة بـ true .

autostart=true : الملف سيعمل بشكل تلقائى ,يمكنك منع ذلك وجعل الزائر يختار التشغيل بابدال القيمة الى false بدلا من true .

hidden=true : هذا الوسم هو الذى يجعل شريط التشغيل يختفى فى الخلفية , بامكانك ان تظهرة بابدال القيمة true وجعلها false .

طبعا كل الكلام ده على اساس ان الملف الصوتى مرفوع بالفعل على الانترنت .
اما لو كان الملف عندك عالهارد فلازم اولا ترفعه على موقع رفع مجانى زى google page creator . طريقة استعمال جوجل بيجز من هــنــا , وبعدين تستعمل اللينك , ولو عايز لينكات مباشرة كمل للاخر فيه كذا طريقة . انزل معايا ....


ثانيا : عرض الملفات الام بى ثرى mp3 :
------------------------------------

بفرض ان الملفات مرفوعه بالفعل على الانترنت ومعاك الروابط بتاعتها , هانستعمل الكود ده بتاع مشغل موقع http://www.odeo.com اعتقد انه اجمل شئ شفته واسهلهم .


<embed src= "http://www.odeo.com/flash/audio_player_standard_gray.swf" quality="high" width="300" height="52" allowScriptAccess="always" wmode="transparent" type="application/x-shockwave-flash" flashvars= "valid_sample_rate=true&external_url=[MP3 file address]" pluginspage="http://www.macromedia.com/go/getflashplayer"> </embed>



استبدل لينك الملف الام بى ثرى بهذه القطعة [MP3 file address] كاملة
ويمكنك التعديل على المقاسات , العرض width والطول height .

مثال : الكود ده لاغنية لسامى يوسف ..
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" src="http://www.odeo.com/flash/audio_player_standard_gray.swf" width="300" height="52" type="application/x-shockwave-flash" quality="high" allowscriptaccess="always" wmode="transparent" flashvars="valid_sample_rate=true&external_url=http://www.sarzaminmp3.com/sarzaminmusic/arabic/128KB/Sami%20Yusuf%20-%20My%20Ummah%202005/04_%20Ya%20Rasulallah.mp3"></embed>


هايدينا المنظر ده :






ثالثا : الفيديو
-------------------

طبعا الفيديو امره سهل , لان بلوجر فيها خدمة رفع الفيديو وبتدعم امتدادات كتير , غير انك ممكن تجيب الفيديو بسهولة من عالـ Youtube او اى موقع تانى بمجرد الحصول على كود الفيديو ونسخه فى التدوينة فى وضع Edir Html مش فى وضع compose .

لكن على اى حال لو عايز تستخدم طريقة الاكواد الكلاسيك , يمكنك استعمال هذا الكود ايضا لجميع انواع الملفات ,صوت او فيديو بامتدادات MP3 , WMA , AVI , MPG


<object id="MediaPlayer" type="application/x-oleobject" height="42" standby="Loading Windows Media Player components..." width="320" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95"><embed type="application/x-mplayer2" src="رابط الملف هنا بين علامتى التنصيص" name="MediaPlayer" width="320" height="42"></embed></object>



وللامتدادات النادرة الاخرى مثل realplayer او quick time او rm او ram او غيرها , صوت او فيديو , يمكنك استعمال هذا الكود


<object codebase="http://www.apple.com/qtactivex/qtplugin.cab" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"><embed pluginspage="http://www.apple.com/quicktime/download/" href="رابط الملف هنا بين علامتى التنصيص" target="myself" kioskmode="true" type="video/quicktime" controller="false" autoplay="false"></embed>
</object>



فى حالة الكودين الاخرين , المتصفح هايطلب منك انك run active x قبل الدخول .
اوهايطلب منك انك install quickplayer لو كان الملف كويك .
ملحوظة : لو كانت الاضافات غير مدعمة فى المتصفح لديك يمكنك تثبيتها من
هـــــنـــا


رابعا : قطع المشغلات الصوتية flash players widgets
--------------------------------------------------

اعتقد ان افضل مشغل من نوع فلاش شوفته هو اللى فى الموقع ده , لوجود كثير من الاشكال وامكانية التعديل على الالوان , وامكانية عمل قائمة تشغيل كاملة playlist بالاضافة الى افض امكانية وهى البحث عن ملفات الام بى ثرى بكل سهولة .
اختار المشغل : من هـــنــا .



بعد الانتهاء هايطلب من التسجيل , وهايديك كود المشغل .
اصنع اداه add a page element من النوع Html/Java script وانسخ فيها الكود واحفظ .

اهم شئ انك ممكن تستعمل الموقع ده فى الحصول على الروابط المباشرة على الانترنت بدون رفع ومعاناه .


-----------------



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

كيف تكتب باحتراف




مع الاسف مع الالم - على راى عبد السلام النابلسى - بدخل مدونات كتير اجد هناك الكثير من التدوينات باللغة العربية مكتوبة من الشمال لليمين , والسبب ان صاحب المدونة اما انه لم يعلم بعد ان بلوجر قد دعمت اللغة العربية , او انه لم يعرب المدونة باى طريقة مثل التى هــنــا ,او هــنــا , لا سيما ان عملية المحاذاة align للنص اثناء تحرير التدوينة لا تجدى مع الكثيرين مادامت المحاذاة الرئيسية للمدونة من اليسار لليمين كاللغة الانجليزية , على اى حال هى فرصة طيبة للتحدث ليس فقط عن كيفية محاذاة النص من اليمين لليار اثناء التحرير , ولكن عن وضع الـ edit html بشكل عام , والذى يتجاهله الكثيرون .

اولا : بعض الاختصارات التى ستتعرض لها اثناء التعامل مع هذا الوضع :


1- هذا الوسم <br> : وهو اختصار لكلمة break ووظيفته " كسر " السطر الحالى وبداية سطر جديد .انشاء سطر جديد بمعنى ابسط .

2- الوسم <div> : واهو اختصار لكلمة division , ووظيفته انشاء قسم جديد . وهذا الوسم يحتاج الى كود غلق بهذا الشكل </div> فى نهاية القسم .

3- الوسم <p> : وهو اختصار لكلمة paragraph ووظيفته انشاء قطعة نصية جديده , ويحتاج ايضا الى كود غلق بهذا الشكل </p> .

4- الوسم <span> : لا اعلم اختصار لاى كلمة , لكن وظيفته اكساب صفات للنص مثل " الحجم " و " اللون " وهكذا كتلك التى نراها .
--------------------

قديما عانيت كثيرا مع الوضع compose لانى كنت ادرج بعض المصطلحات باللغة الانجليزية , وبعد الحفظ اجد وضعية الكلمات الانجليزية تعاكست مع الكلام العربى , والعكس .
والسبب ان الوضع الافتراضى للمدونة ملائم للمستخدم الاجنبى - لم تكن بلوجر دعمت اللغة العربية بعد - اما الان فيمكنك تعريب المدونة لينصلح هذا الامر بسهولة .
دعنا ندخل فى صلب الموضوع

الان انت تريد كتابة تدوينة بسيطة , وليس بها الا نص عربى , وتريد ان تكون محاذاة النص من اليمين الى اليسار , جميل جدا
دعك من وضع الـ compose واختر وضع الـ Edit Html ستفتح لك نافذه بها بضع الاكواد , احذفها كلها وابدا انت بالتالى , العمليه سهلة جدا .
اكتب هذه القطعة البسيطة جدا


<div align="right"> - - - </div>



الان انت انشات قسما div يحاذى النص بداخله الجهة اليمنى . وبالطبع ستضع انت كلامك كله مكان الخطوط الحمراء .
اذا اردت ان تنشأ سطرا جديدا لا تضغط زرار enter فى لوحة المفاتيح , ولكن ببساطة ضف <br> الى جانب الكلمة لتنهى بها السطر وتنشأ سطرا جديدا كما فى المثال .
اما حجم الخط ولونه فالاسهل بكل صراحة ان تتعامل معه فى وضعية الـ compose , بعد ان تنتهى من كتابته بالكامل فى وضعية الـ Edit Html . بدلا من الدخول فى متاهات من الاكواد بدون داعى .



الشكل الذى سيظهر فى الوضعية compose كالتالى



طيب , اذا كنت مثلى , وفى تدويناتك بعض الجمل بالانجليزيه ستجد ان المحاذاة الافتراضيه هى عكس المرغوب فيه تماما , لذلك يجب ان تهيئ هذا القسم div لكى يتعامل مع الوضع , ستضيف هذه القطعة البسيطة dir="rtl" وهى اختصار لكلمة Right To Left لتصبح بالشكل التالى :

<div align="right" dir="rtl"> - - - </div>



ستجد ان الكلام يسير بالشكل الذى اردته تماما .

وبالتالى اذا كانت كل تدويناتك باللغة الانجليزية وادرت فى تدوينة معينة اقتباس مطلحات باللغة الانجليزية , ستستعمل نفس الكود ولكت ستغير القيمة rtl وتجعلها ltr .


يمكنك ايضا ان تستعمل الكود <p> بدلا من <div> , بنفس الطريقة . والافضل ان تنشأ قسم كبير من النوع <div> يتخلله اكواد من النوع <p> حسب الحاجة ,وليس العكس , حيث ان الأول هو الأعم .
واتمنى ان تختفى ظاهرة التدوينات العربية ذات المحاذاة من اليسار الى اليمين من المدونات , يارب .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

قوالب xml


قوالب جديده نوفى

NewFangled

[760689598_5a7671959f_o.jpg]

حمل من
هنا
_____________

Webby

[Plantilla-Webby.jpg]

حمل من
هنا
______________

New Chocolate

[Chocolate.jpg]

حمل من
هنا
________________

Grungy

[grungyscreenshotmin.gif]

حمل من
هنا
________________

Bloggy Mix

[Plantilla-Blix.jpg]

حمل من
هنا

_____________

كل القوالب من النوع الحديث modern
كل قالب عبارةعن ملف بصيغة xml
لمعرفة كيفية تشغيل القوالب الجديده من
هنا
ملحوظة : لوكان نظامك قديم " classic " فلازم تعمل " ترقية upgrad " الاول .
ملحوظة تانية : باستثناء البروفايل والارشيف كل القطع التانية هاتتحذف
لو مش عايزها تتحذف لازم تنقل اكواد القطع دى من التمبليت القديم وتضيفها للتمبليت الجديد قبل الحفظ
لمعرفة مزيد من التفاصيل من
هنا
ملحوظة تالتة : خد نسخة احتياطية " backup " من القالب القديم " download full template "احتياطيا
ولمزيد من التفاصيل من هنا



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

قوالب البلوجرز المعتمدة



كل القوالب دى مجرد تعديل على القوالب الاصلية الشهيرة للبلوجر
وطبعا المعروف ان كل قوالب البلوجر المعتمدة باطار واحد بس جانبى , والقوالب اللى هنا دى هى هى بس باطارين , هى دى الحكاية
طيب انهى الافضل ؟
ميزة القوالب ذات الاطار الواحد ان مساحتها بتفضل زى ما هيا عند تصغير النافذة , بعكس القوالب ذات الاطارين اللى بتنشأ مسطرة افقية فى المتصفح عند تصغير النافذه . على اى حال الذوق وكيفية الاستعمال هما اللى هايحددوا اختيارك .

ملحوظة : كل القوالب دى من النوع الحديث modern , يعنى معمولة بلغة xml , لو صادف ان مدونتك لسه " كلاسيك " فلازم تحولها الى " مودرن " اولا قبل تفعيل اى من تلك القوالب .

طريقة التشغيل مشروحة فى الموضوع ده
والخلاصة انك بعد ما تحفظ القالب عالهارد هاتروح تعمل edit للقالب القديم زى ماهو فى الصورة




وتختار browse وبعدين تختار القالب الجديد




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




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





الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

ايموشنز للبلوجر ... نحن نتحدى الملل



اخر تحديث بتاريخ : 6/8/2009

الكثير لا يعلم مزايا المتصفح firefox وما يميزه عن الـ internet explorer , ربما سوى ان firefox يجعل عملية التصفح اسرع , لكن الامر ان " فايرفوكس " به مزايا اخرى كثيرة من ضمنها ميزة سنتحدث عنها اليوم احم احم.
لا اعلم ما اسمها لكن دعنا نقول انها ميزة اضافة الـ " add ons " او "plugins " او " الاضافات الخاصه " , من ضمن هذه الاضافات اضافة لمستخدمى البلوجرز - اللى هو احنا يعنى ولا مؤاخذه قعدى - يجعلهم قادرين على استخدام " الايموشنز " اثناء تحرير التدوينات وادراجها داخل البوست .
وهذه الصورة مثال لما اريد توضيحة وكيفية انشاءه .



حتى تتمكن من استخدام هذه الخاصيه لابد اولا من تنصيب برنامج " الفايرفوكس"
هذه صفحة موقع البرنامج يمكنك التحميل منها مجانا , من هــــــنــــــا

بعد التحميل والتنصيب , ناتى للخطوة التالية وهى تحميل ملف يجعل " الفاير فوكس " مجهزا لاستقبال الاضافات الخاصة التى تحدثنا عنها , ايا كانت تلك الاضافات , ويمكنك تحميله من هـــــــنــــــا
كيفيه تنصيب هذا الملف كالاتى : شغل برنامج الفاير فوكس وافتح اى صفحة , جوجل مثلا , وقم بـ " سحب والقاء drag and drop " للملف على نافذة " الفايرفوكس " لتظهر نافذة التنصيب وتكمل معاها للاخر .
الخطوة التالية هى تحميل ملف اضافة خاصية " الايموشنز " لمستخدمى البلوجر وبهذا الملف يوجد روابط للصور " الايموشنز " التى ستظهر فى " الفايرفوكس " , اسم الملف emoticons.js و يمكنك تحميله من هــــــــنــــــــا
وطريقة تنصيبه بالظبط كالملف السابق .
بعد تنصيب هذا الملف ستظهر ايكونة تدل على تفعيله فى الركن الايسر بالاسفل من نافذة الفايرفوكس بالشكل الاتى


ولو ضغطت على الايكونة " كليكة " يمين ستظهر خيارات " تفعيل " و " الغاء تفعيل " وباقى خيارات هذه الخاصية .

الان اذهب الى مدونتك , واختار " تحرير edit " تدوينة جديده ستجد ان " الايموشنز " قد ادرجت بالفعل

___________________________________________________

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

اولا : لازم يكون عندك مصدر " source " لايموشنز اللى انت عايزها , منين ؟
ممكن تبحث فى جوجل بكلمة " emotion pack " او " animated emotions " او " ايموشن متحركة " او ماشابه لغاية ما توصل .
يا اما تاخد بعضك وتروح لاى منتدى من اللى سعادتك مسجل فيهم , وتعمل نفسك كانك هاترد على موضوع فى المنتدى
بينى و بينك ( بينى وبينك يعنى ) , هاتلاقى ف صفحة اضافة الرد ايموشنات على جنب , اعمل save picture as للايموشنز اللى تعجبك عالهارد عندك . او تضغط كليكة يمين وتختار properties وتنسخ اللينك بتاعها علطول , اعمل اى حاجه المهم تجيب ايموشنز من تحت " طقاطيق " الارض سيبونى عليه .

ثانيا : ترفع الايموشنز اللى عندك عالهارد لموقع رفع صور , والافضل استخدام حساب على google page creator ولمعرفة كيفية الاشتراك ورفع الملفات روح للموضوع ده هتلاقى فيه الشرح . من هـــــــــــــــــــــــــنــــــــــــــــــا
وده برنامج لرفع الصور الى موقع imageshacker للى عايز يستخدمه للرفع بدلا من google pages جابهولنا الدكتور بطوط حبوب , من هــــــــنـــــــا , وبنهديله الوردة دى من اسرة البرنامج


ثالثا : هانفتح مع بعض الملف اللى اسمه bloggeremoticons.user.js بالـ notepad او البرنامج النصى بتاع الويندوز , عشان نعدل عليه ونغير روابط الايموشنز القديمة ونستبدلها بالروابط الجديده .
هنلاقيه بالشكل ده

// Based on the original emoticonsforblogger by Kuribo (http://www.kuribo.info/2006/04/emoticons-for-blogger.html)
// Modified by Wolverinex02 (http://wolverinex02.blogspot.com/)

// FEATURES
// Works only in Compose modes
// Add the emoticons at the end of the text

// TODO
// modify the script to insert the emoticon directly after the cursor

// ==UserScript==
// @name Emoticons for Blogger
// @namespace http://www.kuribo.info/
// @description You can use emoticons in Blogger.
// @include http://*.blogger.com/post-edit.g?*
// @include http://*.blogger.com/post-create.g?*
// ==/UserScript==

window.addEventListener("load", function(e) {


function setemoticons(domname)
{
var editbar = document.getElementById(domname);
if (editbar) {

var buttons = "<br />";
buttons += emoticonButton("arrow", "http://wolverinex02.googlepages.com/icon_arrow.gif");
buttons += emoticonButton("biggrin", "http://wolverinex02.googlepages.com/icon_biggrin.gif");
buttons += emoticonButton("confused", "http://wolverinex02.googlepages.com/icon_confused.gif");
buttons += emoticonButton("cool", "http://wolverinex02.googlepages.com/icon_cool.gif");
buttons += emoticonButton("cry", "http://wolverinex02.googlepages.com/icon_cry.gif");
buttons += emoticonButton("eek", "http://wolverinex02.googlepages.com/icon_eek.gif");
buttons += emoticonButton("evil", "http://wolverinex02.googlepages.com/icon_evil.gif");
buttons += emoticonButton("exclaim", "http://wolverinex02.googlepages.com/icon_exclaim.gif");
buttons += emoticonButton("idea", "http://wolverinex02.googlepages.com/icon_idea.gif");
buttons += emoticonButton("lol", "http://wolverinex02.googlepages.com/icon_lol.gif");
buttons += emoticonButton("mad", "http://wolverinex02.googlepages.com/icon_mad.gif");
buttons += emoticonButton("mrgreen", "http://wolverinex02.googlepages.com/icon_mrgreen.gif");
buttons += emoticonButton("neutral", "http://wolverinex02.googlepages.com/icon_neutral.gif");
buttons += emoticonButton("question", "http://wolverinex02.googlepages.com/icon_question.gif");
buttons += emoticonButton("razz", "http://wolverinex02.googlepages.com/icon_razz.gif");
buttons += emoticonButton("rolleyes", "http://wolverinex02.googlepages.com/icon_rolleyes.gif");
buttons += emoticonButton("redface", "http://wolverinex02.googlepages.com/icon_redface.gif");
buttons += emoticonButton("sad", "http://wolverinex02.googlepages.com/icon_sad.gif");
buttons += emoticonButton("smile", "http://wolverinex02.googlepages.com/icon_smile.gif");
buttons += emoticonButton("surprised", "http://wolverinex02.googlepages.com/icon_surprised.gif");
buttons += emoticonButton("twisted", "http://wolverinex02.googlepages.com/icon_twisted.gif");
buttons += emoticonButton("wink", "http://wolverinex02.googlepages.com/icon_wink.gif");

buttons += separator();


editbar.innerHTML += buttons;
}
}


function emoticonButton(name, url) {
return "<span class='' style='display: block;' id='htmlbar_undefined' title='" + name + "' onmouseover='ButtonHoverOn(this);' onmouseout='ButtonHoverOff(this);' onmouseup='' onmousedown='CheckFormatting(event);(function() {var rich_edit = document.getElementById(\"richeditorframe\");var rich_body = rich_edit.contentDocument.getElementsByTagName(\"body\");rich_body[0].innerHTML+=\"<img class=\\\"emoticon\\\" src=\\\""+url+"\\\" width=\\\"15\\\" height=\\\"15\\\" alt=\\\"" + name + "\\\" title=\\\"" + name + "\\\" />\";})();ButtonMouseDown(this);'><img src='" + url + "' alt='" + name + "' border='0'></span>\n";
}

function separator() {
return "<div style=\"display: block;\" class=\"vertbar\"><span style=\"display: block;\" class=\"g\"> </span><span style=\"display: block;\" class=\"w\"> </span></div>\n";
}

setemoticons("formatbar");

}, false);


- روابط الايموشنز هى اللى ملونة باللون الاحمر , هانغيرها بالروابط الجديدة بتاعة الايموشنز اللى رفعناها على google page creator او اى سيرفر تانى , او حتى لينكات ايموشنز موجوده جاهزة عالويب , نوبروبليمز .

- الكلام اللى مكتوب باللون الازرق ده " عنوان " كل ايموشن على حده , وده اللى هايظهر لما تقف بالمؤشر على الايموشن , ممكن تغيره بس لازم يكون انجليزى .

- حاجه مهمة جدا , الكلام اللى ملون باللون الاخضر ده عباره عن كودين لتحديد " طول " و " عرض " كل الايموشنز الموجوده , ودول مهمين فى حالة اذا كانت كل الايموشنز مقاساتها واحده , انما لو الايموشنز مقاساتها مختلفة هاتضطر تحذف الكودين دول ( كل الكلام الملون باللون الاخضر ) , عشان الايموشنات تظهر بحجمها الطبيعى . وده افضل من تحديدها بحجم معين .

- بعد التعديل على الملف احفظه , وسطبه مع الفاير فوكس بالطريقة اللى قولناها قبل كده . ولو كنت مسطب الخاصية قبل كده بالفعل دوس " كليكة " يمين على ايكونة الخاصية , وانزع علامة " صح " من كلمة enable عشان تبطل الخاصية , وتفعل الملف الجديد .

- يفضل فى الايموشنز اللى تختارها الاتى :
1- ان حجمها " بالكيلو " ميكونش كبير عشان ميحصلش بطء فى تحميل الصفحات .
2- ان مقاساتها " الطول والعرض " متكونش كبيرة , عشان ميحصلش مساحات متباينة بين السطور بسبب مقاس الايموشن .
3 - ان عدد الايموشنز ميكونش كبير , ممكن 25 بحد اقصى , او 300 كيلو بايت كحجم اقصى لكل الايموشنز . منعا لبطئ التحميل .

انا عملت الايموشنز الخاصة بيا والشكل النهائى كان كده , مقاسات الايموشنزكانت مختلفة انما بتتراوح من 35 الى 50 بيكسل , مش اكتر من كده , عشان كده اضطريت احذف الكودين بتوع تحديد الطول والعرض .


واى استفسار على الرحب والسعة , وكل سنة ونتم طيبين بمناسبة المولد النبوى
.
ــــــــــــــــــــــــــــــــــــــــــ

تحديث :
اختصارا للوقت والجهد قمت بعمل ملف به روابط جميع " ايموشنز" الياهو ماسنجر .
thinkingchatterboxangelclownsilly cowboy time out

كل ما عليك انك تسطبه بدلا من الملف بالاعلى . حمل الملف ده , واسمه bloggeremoticons2.user من هــــــــنـــــــــا

والشكل النهائى هايكون كده ...


اللى يعرف حد عنده " بلوج " يشرحله الطريقة يا خوانا
call me , عشان انا حاسس ان التدوين بقا ممل yawn , و الايموشنز دى ممكن تبعث جو من المرح rolling on the floor بالاضافة الى انها هاتساعد على التعبير party .



الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا