الأربعاء، 17 أغسطس، 2011

شرح مفصل | التدوين السريع المصغر | اجعل بلوجر ينافس تويتر






نعرف جميعاً ما هو التدوين المصغر المنتشر حالياً والذى عُرف مع إنطلاق خدمة تويتر رسمياً



وهو عبارة عن تحديثات كتابية تصف الأحداث التي تعاصرها في يومك علي مدار الساعة





فإذا كان التدوين من خلال تويتر هو للإجابة على السؤال ’’ماذا تفعل الان؟‘‘ فالتدوين المصغر داخل blogger



هو لكتابة أفكار صغيرة وتلميحات وأسئلة لا تحتمل كتابة مواضيع طويلة ونقاشات لنفس التخصص



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





يبقى القول أن التدوين المصغر داخل blogger ليست ميزة جاهزة مضافة داخل القالب



بل هي طريقة جديدة نتعلمها سوياً عن طريق تخصيص القالب بطريقة احترافية





وبالإعتماد على أدوات الشرط المختلفة لتحديد تصنيف معين " Label "



تظهر داخله تلك التدوينات دون غيره









_______________________________



خطوات تطبيق هذه الميزة الاحترافية في مدونتك

_______________________________







توجه إلى : تصميم > تحرير HTML > أخذ نسخة احتياطية > توسيع القالب > ابحث عن التالي







<b:includable id='post' var='post'>




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





<b:includable id='minipost' var='post'> <b:if cond='data:blog.pageType != &quot;item&quot;'>  <div class='minipost'><a expr:name='data:post.id'/>     <div class='entry'><data:post.body/></div>     <p class='meta'><a expr:href='data:post.url'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a><b:if cond='data:post.allowComments'> /<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 0'> أضف تعليق<b:else/><b:if cond='data:post.numComments == 1'> تعليق واحد<b:else/><b:if cond='data:post.numComments == 2'> تعليقان<b:else/><b><data:post.numComments/></b> تعليق</b:if></b:if></b:if>…</a><b:else/></b:if><b:include data='post' name='postQuickEdit'/></p> </div>  <b:else/>  <div class='minipost'><a expr:name='data:post.id'/>     <h2 class='title'><a expr:href='data:post.url'><data:post.title/></a></h2>     <div class='entry'><data:post.body/></div>     <p class='meta'><a expr:href='data:post.url'><abbr class='published' expr:title='data:post.timestampISO8601'><data:post.timestamp/></abbr></a><b:if cond='data:post.allowComments'> /<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 0'> أضف تعليق<b:else/><b:if cond='data:post.numComments == 1'> تعليق واحد<b:else/><b:if cond='data:post.numComments == 2'> تعليقان<b:else/><b><data:post.numComments/></b> تعليق</b:if></b:if></b:if>…</a><b:else/></b:if><b:include data='post' name='postQuickEdit'/></p> </div>  </b:if> </b:includable>


_______________________________



ثم قم بالبحث عن الكود التالي





<b:include data='post' name='post'/>




واستبدله بالكود التالي





<b:if cond='data:post.labels'>  <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast == &quot;true&quot;'> <b:if cond='data:label.name != &quot;minipost&quot;'>  <b:include data='post' name='post'/>  <b:else/>  <b:include data='post' name='minipost'/>  </b:if> </b:if> </b:loop>  <b:else/>  <b:include data='post' name='post'/>  </b:if>




_______________________________



الآن قم بالبحث عن الوسم التالي





]]></b:skin>


(إذا رغبت في أن تظهر التدوينات المصغرة لديك مثل هذه الصور)






للمعاينة الحية للتدوينات المصغرة التي بهذه الصورة اضغط هنا




أضف قبل الوسم السابق مباشرة هذا الكود





/* MINIPOST */ .minipost {     background: #FFF6C7 url(http://lh4.ggpht.com/_dInhsEHH_98/S9XNkXGx8rI/AAAAAAAAACY/EtZcz9T63Cw/s00/bg-minipost.gif) no-repeat 100% 2px;     padding: 15px 95px 15px 15px;     border:1px solid #FFF6C7;     margin-bottom:20px;     position:relative; } .minipost .entry {     -webkit-text-shadow: #FFFBD8 0 1px 0px;     text-shadow: #FFFBD8 0 1px 0px;     text-align:justify;     font: bold 15px/1.2 Arial, sans-serif;     color:#515151; } .minipost .entry a { color:#B40000; }

.minipost .entry a:hover { color:#3A3A3A; } .minipost .entry, .minipost .entry p { margin-bottom: 15px; } .minipost p.meta {

    margin:-10px 0 0;

    font-weight:normal;     font-size: 12px;

    color:#B9B197;

} .minipost p.meta a { color:#B9B197;} .minipost p.meta a:hover { color:#807970;}








(أما إذا رغبت في أن تظهر التدوينات المصغرة لديك مثل هذه الصورة - مصغرات مدونة أبو إياد )




للمعاينة الحية للتدوينات المصغرة التي بهذه الصورة اضغط هنا




فأضف هذا الكود قبل الوسم السابق مباشرة





.minipost { -moz-border-radius: 5px 5px 5px 5px;    background: #CFE1ED url("http://1.bp.blogspot.com/-epcKn8QvEwg/Tc21gc3oPYI/AAAAAAAACEM/hNhSG0UelWk/s1600/lam7a.png") ;     height: 1%;     padding: 20px; border-left:1px solid #1D5C88;     border-top:1px solid #1D5C88;         border-right: 1px solid #1D5C88;         border-bottom: 1px solid #1D5C88; margin:.5em 0 1.5em; border-bottom:0px dotted $bordercolor; padding-bottom:1.5em; padding-right:7px; padding-left:7px; }

.minipost .entry {     -webkit-text-shadow: #FFFFFF 0 1px 0px;     text-shadow: #FFFFFF 0 1px 0px;     text-align: right;     font: 15px Tahoma, Arial, sans-serif;     color:#4C4C4C; }

.minipost img {     border: 1px solid #245CAA;

    float: right;

    margin-left: 1em; } .minipost h3 {     color: #666;

    font-size: 1.2em;

    margin-bottom: 5px;

    margin-top: 2; } .minipost p {     color: #54524F;

    font-size: 15px;

    margin-bottom: 10px;     margin-top: 0; } .minipost blockquote {   background: url(http://lh6.ggpht.com/_4_wf1DKMvX4/TMWm472NmPI/AAAAAAAABmw/aioU52gp7Zw/box-bgr.gif) #ffffff repeat-x top;     border-left:1px solid #CFCFCF;     border-top:1px solid #CFCFCF;         border-right: 1px solid #CFCFCF;         border-bottom: 1px solid #CFCFCF;     margin:10px;     padding:10px }


(أو إذا رغبت في أن تظهر التدوينات المصغرة لديك مثل هذه الصورة - مصغرات مدونة ذؤيب )



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







/* blogger minipost */

.minipost {

background: #F5F5F5;

padding: 15px;

border: 1px solid #DDDDDD;

margin-bottom: 20px;

padding-bottom: 30px;

font: 12px tahoma;

text-align: justify;

line-height:1.5em;

}

.minipost img {

    float: right;

    margin-left: 1em;

}

.minipost div.title2 {

font:1.3em arial;

font-weight:bold;

letter-spacing:0em;

display:block;

padding-bottom:5px;

text-shadow: 0px 2pt 0px #ECECEC;

}

.minipost div.entry {color:#333333;}

.minipost p.meta {

font: 12px tahoma;

}








_______________________________



قم بحفظ التغييرات التي أحدثتها على قالبك

_______________________________







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



لكن قبل نشر هذه التدوينة قم بإضافة هذه التسمية "
minipost" في المكان المخصص لذلك





أي أنك قبل نشر التدوينة المصغرة يجب عليك كتابة minipost بجانب خانة "التسميات" - كما بالصورة







انشر تدوينك المصغرة الآن وعاينها في مدونتك ..!!




_______________________________





الآن ليس عليك سوى تخصيص هذه الميزة الاحترافية بما يناسب مدونتك



وذلك بالعودة إلى : تصميم > تحرير html > توسيع القالب > ابحث عن التالي (لتغيير التسمية
minipost بما يناسبك)





<b:if cond='data:label.name != &quot;minipost&quot;'>




ثم غّير " minipost " في الكود بالتسمية التي تريدها











_______________________________
















تم بحمد الله  ◕‿◕





18 التعليقات:

Anonymous يقول... في 17 أغسطس، 2011 7:46 ص

( طريقة التركيب منقولة من مدونة المصنع )

مدونة كن داعيا للخير يقول... في 17 أغسطس، 2011 8:06 ص

موضوع مفيد ومهم

أسماء || أم نضال || يقول... في 18 أغسطس، 2011 7:13 ص

بارك الله فيكم إخوتي .. أتمنى أن أكون قد أفدتكم

"غير معرف" أعتقد أن اسمك الحقيقي سيكون أجمل ..!!

mohamed gohar يقول... في 19 أغسطس، 2011 4:28 م

معلةومات جميله ومفيده يا اسماء...
ولاكن ياريت الخط يكون كبير شويه عن كده

Anonymous يقول... في 19 أغسطس، 2011 7:57 م

الطريقة دى مش شغاله يااخت اسماء ياريت تشوفلنا طريقة تانيه

أسماء || أم نضال || يقول... في 20 أغسطس، 2011 7:43 ص

@محمد جوهر عدلى

سأضيف خاصية تكبير الخط بالمدونة إن شاء الله .. بارك الله فيك


@غير معرف

تأكدت منها قبل إضافتها ولديك المدونة التجريبية كمثال

ما هو القالب الذي تستخدمه ؟

anass hassouni يقول... في 21 أغسطس، 2011 3:23 م

بارك الله فيك أخت أسماء
دائما تسعي الى كل جديد و مفيد

بس كما اقترح الأخ حبدا لو تكبري الخط قليلا

لا أنسى أن أنوهك على الرد الرائع ههه

"غير معرف" أعتقد أن اسمك الحقيقي سيكون أجمل ..!!

في امان الله

أسماء || أم نضال || يقول... في 21 أغسطس، 2011 4:24 م

@أنس حسوني

وفيك بارك الله .. إن شاء الله سيتم تطبيق الاقتراح قريبا

للأسف هناك من يستغل ميزة التعليق بغير معرف ليجاهر بسوء خلقه .. كان بودّي إتاحة فرصة التعليق للزوار لكن للأسف

anass hassouni يقول... في 21 أغسطس، 2011 11:13 م

نعم بالفعل أختي

نتمنى لهم الهداية من المولى عز وجل

Anass يقول... في 26 أغسطس، 2011 10:59 ص

السلام عليكم
شكراا أختي أسماء التدوينة
حاليا انا استعمل قالب المصنع و لاكن على سكريبت الوورد بريس و التدوين المصغر في الووردبريس يحتاج اضافة معية (نسيت اسمها هههه)
هدا اول تعليك لي في مدونتك الاكتر من رائعة من حميع النواحي التصميم , المواضيع المطروحة
و السلام عليكم
اخوك أناس
http://anassq.eb2a.com/blog

أسماء || أم نضال || يقول... في 26 أغسطس، 2011 2:28 م

@Anass

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

إنسـان يقول... في 29 أغسطس، 2011 8:02 ص

اختي الرائعة اسماء

اتمنى منك تعليمي طريقة ادراج تعليق الفيسبوك كما في موضوعك هذا .. الميزة اعجبتني واتمنى ان لا تبخلي علي ^_^

أسماء || أم نضال || يقول... في 29 أغسطس، 2011 9:47 ص

@إنسـان

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

Mohamed Samir يقول... في 31 أغسطس، 2011 12:27 ص

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

{ .. متابع

أسماء || أم نضال || يقول... في 31 أغسطس، 2011 2:25 ص

@Mohamed Samir

قمت بذكر المصدر في آخر التدوينة وبآخر الموضوع في منتدى بلوجر بالعربي

( طريقة التركيب منقولة من مدونة المصنع )

جهدي في الموضوع هو تنسيق أكواد الـCSS التي واجه الكثيرون مشكلة معها

أسماء || أم نضال || يقول... في 3 سبتمبر، 2011 6:37 ص

@إنسـان

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

شرح كامل | أضف صندوق تعليقات فيسبوك إلى بلوجر بدون مشاكل

مدونة جديد الإفادة يقول... في 28 يناير، 2012 6:58 ص

بارك الله فيك إنها إضافة اكثر من رائعة

و الله فكرة رائعة جدا جدا

قد تغنينا عن الفايسبوك و تويتر حقا ههههه

و أيضا ستزيد من نشاط المدونة كثيرا

لكن هناك مشكلة كبيرة جدا جدا

و هي أنني أظن أن هذه الإضافة غير مقبولة في سياسة جوجل أدسنس، لأنو من أساسيات جوجل أدسنس موضوع مفيد و أظن يكون عنده حد في عدد الحروف كأقل تقدير

أتمنى تريدين علي إن كان يخالف سياسة جوجل أدسنس أو لا، و إن كان لا يخالف سأضيفه على طول

بارك الله فيك !!!

أسماء || أم نضال || يقول... في 28 يناير، 2012 7:35 ص

@مدونة جديد الإفادة

وفيك بارك الرحمن أخي ،،

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

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

لهذا لا يمكن أن تكون مخالفة لأدسنس والله أعلم

إرسال تعليق

 

me | twitter