الجمعة، 28 فبراير 2014

تحميل قوالب بلوجر بمناسبة إقتراب شهر رمضان

بقلم: BR MED يوم الجمعة، 28 فبراير 2014 القسم : 0 التعليقات

سلام الله عليكم، نلتقي من جديد في ورشة مدون اليوم أحبابي فالله بعد أن طلب مني بعض الاخوة في الصفحة أنهم يريدون قوالب رمضانية فقمت بجمع مجموعة من القوالب الجميلة التي يمكنك وتركيبها لمدونتك بلوجر في مناسبة شهر رمضان الأعظم.
مميزات القوالب .
- قوالب بألوان غامقه " داكنه " .
- يميل بألوانه الى كثير من القوالب التي كان يطلبها المستخدم في بلوجر سابقاً كـ قالب مدونة رشيد .
- يمتلك عمود أيسر مقسم الى ثلاث أنواع .
- يمكتلك 3 أعمدة في الفوتر .
- قابل لتفعيل أزرار المواقع الإجتماعية الأصلية في بلوجر والتي تدعم نشر المواضيع في كلٍ من
{ كتابة تدوينة حول التدوينة - إرسال التدوينة بالبريد الإلكتروني - نشر التدوينة في تويتر او فيس بوك او صدى جوجل - اضافة جوجل بلس للتدوينة } كما انه يمكنك الغائها .
- تمييز تعليقات الكتاب بوصف صوري " كاتب " يمكن استبدالها والتعديل عليها .
- يمتلك مربع اشتراك بريدي وزر اشتراك داخل كل موضوع .
- أرشفه ممتازة وقوية .
- التاريخ الهجري باليوم عربياً .
غير ذلك يمكنكم مشاهدة المثال المباشر ..,
الشكل الأول:
[معاينة] ******* [تحميل]


الشكل الثاني:
[معاينة] ******* [تحميل]


الشكل الثالت:
[معاينة] ******* [تحميل]


الشكل الرابع:
[معاينة] ******* [تحميل]


الشكل الخامس:
[معاينة] ******* [تحميل]


الشكل السادس:
[معاينة] ******* [تحميل]


الشكل السابع:
[معاينة] ******* [تحميل]

الشكل الثامن والاخير:

[معاينة] ******* [تحميل]

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

الخميس، 27 فبراير 2014

إضافة أزرار المشاركة الإجتماعية لمدونة بلوجر

بقلم: BR MED يوم الخميس، 27 فبراير 2014 القسم : 0 التعليقات

السلام عليكم ورحمة الله وبركاته، أهلا بكم من جديد زوارنا الأوفياء على مدونة ورشة مدون اليوم أحبابي في الله معي إضافة جميلة جدا تندرج دمن الإضافات الإجتماعية هذه الأخيرة عبارة عن زر كلما قمت بتمرير سهم الماوس عليها تنبثق لك أزرار المشاركة للمواقع الإجتماعية المشهورة كما لاحظتم في الصورة أعلاه هذه الإضافة مهمة نوعا ما في إشهار مدونتك في حالة مشاركة الزوار لمدونتك مع أصدقائهم... المهم ننتقل لتركيب الإضافة .
1-نذهب إلى لوحة التحكم.
2-نضغط على قالب ونأخد نسخة إحتياطية في حالة وقوع خطأ ما
3-نضغط تحرير html
4-ثم نبحث عن هذا الوسم <body/> ونضع فوقه هذا الكود مباشرة
5-وأخير نقوم بحفظ القالب
<!-- Start Social Sharing Widget Sassy Bookmarks HTML (warch-mo.blogspot.com)--><br />
<div class="shr_ss shr_publisher">
<br />
</div>
<!-- End Shareaholic Sassy Bookmarks HTML --><br />
<!-- Start Shareaholic Sassy Bookmarks settings --><br />
<script type="text/javascript">
  var SHRSS_Settings = {"shr_ss":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}};
  </script><br />
 <!-- End Shareaholic Sassy Bookmarks settings --><br />
<!-- Start Shareaholic Sassy Bookmarks script --><br />
<script type="text/javascript">
       (function() {
            var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true;
            sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js";
            var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s);
        })();
        </script><br />
<br />
<!-- End Shareaholic Sassy Bookmarks script -->
أتمنى أن تعجبكم الإضافة، لاتنسو لايك لصفحتنا على الفيس بوك لتتوصل بكل جديد المدونة
في أمان الله
إقرأ البقية

الطريقة الصحيحة لدمج تعليقات الفيس بوك مع تعليقات بلوجر

بقلم: BR MED يوم القسم : 0 التعليقات

مرحبا، اليوم أحبابي في الله سوف نتعلم كيفية دمج تعليقات الفيس بوك مع تعليقات بلوجر هذه الميزة تمنح مدونتك جمالية وأناقة أكثر حيث ستتخلص من ذلك الفراغ الشاسع الموجود بين تعليقات الفيس بوك وتعليقات البلوجر طريقة صحيحة وحصرية فقط على مدونة ورشة مدون... كي لا أطيل عليكم ننتقل للشرح
النموذج الأول
 قبل كل شيء أنصحك بأخد نسخة إحتياطية للقالب تحسبا لأي خطأ أو في حالة لم تعجبك الإضافة
1-ندهب إلى لوحة التحكم نختار القالب نضغط تحرير html 
2-نضغط  ctrl+f ونبحث عن الكود التالي

<div class='comments' id='comments'>
ستجده مكرر ضع تحت كل واحد الكود التالي

  <div class='comakauttafb-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Add Comments via Facebook'><img class='comakauttafb-tab-icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilb8X4bXXiuA_EcZShIqDJsYDWiiIrO8BTdouvfBsGek2Bd6CFJBVb_ckQClan_xp1In44Km7Y0k27WjSWg2JOyvQRjxl8c8htTvd-l80HajnvXGRdbwU4yrXAqLw37ax84fmcgtNipGA/s1600/FACEBOOK.png'/><fb:comments-count expr:href='data:post.url'/> التعليقات</div><div class='comakauttafb-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Add Comments via Blogger'><img class='comakauttafb-tab-icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKrmVUWB84dA32xriawO6wqkuaQ2JXcYd932YNzji8E581d7Rnu2JXXudaXK9pOQIRxTtIRG9_StR2RMHovtGPYVxZ0JQWeTMNXUNr0j6AkaI1DKt1XBhUMZvMW6KYaFsOcwBTMSEtFOM/s1600/BLOGGER.png'/> <data:post.numComments/> التعليقات</div><div class='clear'/></div><div class='comakauttafb-page' id='fb-comments-page'><b:if cond='data:blog.pageType == &quot;item&quot;'><div id='fb-root'/><fb:comments color='dark' expr:href='data:post.url' num_posts='10' width='680'/></b:if></div><div class='comments comakauttafb-page' id='blogger-comments-page'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='additions.blogger' property='fb:admins'/><script type='text/javascript'>function commentToggle(selectTab) {$(&quot;.comakauttafb-tab&quot;).addClass(&quot;inactive-select-tab&quot;);$(selectTab).removeClass(&quot;inactive-select-tab&quot;);$(&quot;.comakauttafb-page&quot;).hide();$(selectTab + &quot;-page&quot;).show();}</script><style type='text/css'>.comakauttafb-page, .comakauttafb-tab {-moz-border-radius:10px 10px 10px 10px; -webkit-border-radius:10px 10px 10px 10px; border-right:5px solid #ccc; border-top:3px solid #ccc; border-bottom:3px solid #ccc; border-right:5px solid #ccc}.comakauttafb-page {background:transparent;);margin-top:8px;}#blogger-comments-page {padding:0px 5px;display:none;}.comakauttafb-tab {text-shadow:0px 1px 1px #fff;color:#000;float:right;padding:5px;margin-right:5px;cursor:pointer;background:transparent;);-o-transition:.5sease-out;-moz-transition:.5s ease-out;-webkit-transition:.5s ease-out}.comakauttafb-tab-icon {height:16px;width:16px;margin-right:5px;}.comakauttafb-tab:hover {background:rgba(219,219,219,.8);}.inactive-select-tab {background:rgba(255,255,255,.4);}.inactive-select-tab, .comakauttafb-tab:hover {box-shadow:-1px -1px 1px #fff,1px 1px 1px #fff,1px 1px 5px #000;-moz-box-shadow:-1px -1px 1px #fff,1px 1px 1px #fff,1px 1px 5px #000;-webkit-box-shadow:-1px -1px 1px #fff,1px 1px 1px #fff,1px 1px 5px #000}</style>

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

النموذج الثاني

نفس طريقة تركيب الأول ولكن نضع هذا الكود

  <div class='comakauttafb-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Add Comments via Facebook'><img class='comakauttafb-tab-icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE7kPlhSg36SZdfL4wJvPm2ysR6zZieHEh4iEf1-rD9uuok4Y4AA7Jil1e1V5OBbE-py9Ki3BCUM3W0D4_69gUydntpaGjRemKnwZkMHZRHrlTcs_u1ciOYiqNye7l3Aa-Pe2fHXsEPi_d/s1600/add-b.blogspot1.png'/><fb:comments-count expr:href='data:post.url'/> التعليقات</div><div class='comakauttafb-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Add Comments via Blogger'><img class='comakauttafb-tab-icon' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQWqtjMzQG5yO9Q5xmfJ3iw9JI6cHntc9QIm7OkUDZV6Va-tL1S507xcCGCqBK7KpQPZjxP1Mbk1xuPvl9UpQVzFHSepsoWyUaSCCV0xO1nb0A21W7llXErGOKVC8CCQGNCyhZTQ8jrp2/s1600/add-b.blogspot.com.jpg'/> <data:post.numComments/> التعليقات</div><div class='clear'/></div><div class='comakauttafb-page' id='fb-comments-page'><b:if cond='data:blog.pageType == &quot;item&quot;'><div id='fb-root'/><fb:comments color='dark' expr:href='data:post.url' num_posts='10' width='639'/></b:if></div><div class='comments comakauttafb-page' id='blogger-comments-page'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='additions.blogger' property='fb:admins'/><script type='text/javascript'>function commentToggle(selectTab) {$(&quot;.comakauttafb-tab&quot;).addClass(&quot;inactive-select-tab&quot;);$(selectTab).removeClass(&quot;inactive-select-tab&quot;);$(&quot;.comakauttafb-page&quot;).hide();$(selectTab + &quot;-page&quot;).show();}</script><style type='text/css'>.comakauttafb-page, .comakauttafb-tab {-moz-border-radius:10px 10px 10px 10px; -webkit-border-radius:10px 10px 10px 10px; border-right:5px solid #ccc; border-top:2px solid #ccc; border-bottom:2px solid #ccc; border-right:2px solid #ccc}.comakauttafb-page {background:transparent;);margin-top:8px;}#blogger-comments-page {padding:0px 5px;display:none;}.comakauttafb-tab {text-shadow:0px 1px 1px #FFA221;color:#FFA221;float:right;padding:5px;margin-right:5px;cursor:pointer;background:transparent;);-o-transition:.5sease-out;-moz-transition:.5s ease-out;-webkit-transition:.5s ease-out}.comakauttafb-tab-icon {height:16px;width:16px;margin-right:5px;}.comakauttafb-tab:hover {background:rgba(219,219,219,.8);}.inactive-select-tab {background:rgba(255,255,255,.4);}.inactive-select-tab, .comakauttafb-tab:hover {box-shadow:-1px -1px 1px #fff,1px 1px 1px #fff,1px 1px 5px #000;-moz-box-shadow:-1px -1px 1px #fff,1px 1px 1px #fff,1px 1px 5px #000;-webkit-box-shadow:-1px -1px 1px #fff,1px 1px 1px #fff,1px 1px 5px #000}</style>
يمكنك أيضا تغير عرض التعليقات ليتناسب مع مدونتك بتغير 639
أتمنى أن تعجبكم الإضافة 
لاتنسو لايك لصفحتنا على الفيس بوك لتتوصل دائما الجديد  

إقرأ البقية

الأحد، 23 فبراير 2014

كيفية إضافة خدمة 'اتصل بنا' لمدونة بلوجر بشكل إحترافي

بقلم: BR MED يوم الأحد، 23 فبراير 2014 القسم : 2 التعليقات
السلام عليكم و ررحمة الله و بركاته.
نموذج الإتصال من الأمور الضرورية التي ينبغي للمدونات أو المواقع الإحترافية أن تتوفر بها. شأنها شأن سياية الخصوصية ، فمن صفحة إتصل بنا أو ما يسمى "contact form" يستطيع الزوار التواصل مع إدارة في حالة الضرورية مثل طلبات الإعلان الممولة أو مشاكل في الموقع أو أمور مماثلة.
ما يميز نموذج إتصل بنا هذا هو سهولته و إحترافيته دعك من المواقع التي توفر لك تلك الخدمة، فاليوم سوف نعتمد على أداة إتصل بنا التي تمنحها لنا منصة بلوجر، وحيث سنقوم تغير حجمها و الستايل الخاص بها. كي لا أطيل عليكم ننتقل إلى الشرح.


طريقة التركيب :

1 - إذهب للوحة تحكم البلوجر ثم التخطيط ثم إختيارأداة نموذج الإتصال كما في الصورة. 
ملاحظة هامة: هذا في حالة إن لم تكن قد أضفتها سابقا إن كنت قد أضفتها لا تضفها مرة ثانية و لكن إنتقل للخطوة الثانية من الشرح.

 
2 - إذهب للقالب و يستحسن أخد نسخة إحطياطية منه تفاديا لأي مشكلة، بعده تضغط تحرير html .
3 - إنقر وسط الأكواد و إستعن بالزرين ( crtl+f ) للبحث عن عبارة : ContactForm1.
4 - بعد أن تجدها قم بتوسيع الأكواد بالضغط على المثلث أو السهم الصغير بجانب السطر الخاص بالإضافة. أنظر الصورة.



5 - ثم قم بتوسيع السطر الذي بعده. كما في الصورة.

6 - قم بحذف جميع الكواد التي قمت بالإشارة لها في الصورة التالية.

 7 - إستعن بالزرين (ctrl+f) للبحث عن الوسم التالي: ]]></b:skin> ثم ضع فوقه الكود التالي و إحفظ القالب.
/* Contact Form Container */
.contact-form-widget {
width: 500px;
max-width: 100%;
margin: 0 auto;
padding: 10px;
background: #F8F8F8;
color: #000;
border: 1px solid #C1C1C1;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
border-radius: 10px;
}

/* Fields and submit button */
.contact-form-name, .contact-form-email, .contact-form-email-message {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
}

/* Submit button style */
.contact-form-button-submit {
border-color: #C1C1C1;
background: #E3E3E3;
color: #585858;
width: 20%;
max-width: 20%;
margin-bottom: 10px;
}

/* Submit button on mouseover */
.contact-form-button-submit:hover{
background: #4C8EF9;
color: #ffffff;
border: 1px solid #FAFAFA;
}

8 - الآن إذهب للصفحات و قم بإنشاء صفحة جديدة. ضع العنوان الذي يناسبك للصفحة ثم إنقر على الزر html غالبا سوف تجد سطرين من الأكواد قم بمسحها كلها وضع مكانها الكود الثالي:
<div class='widget ContactForm' id='ContactForm1'>
<div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<p>الإسم الكامل</p>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
<p>البريد الإكتروني *</p>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
<p>نص الرسالة *</p>
<textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='إرسال'/>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</form>
</div>
</div>
</div>
9 - قم بحفظ الصفحة و مبروك عليك نمودج إتصل بنا الإحترافي
هذا كل ما في موضوع اليوم ، أي إستفسار أنا في الخدمة، بالتوفيق للجميع في أمان الله.
إقرأ البقية

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

بقلم: BR MED يوم القسم : 0 التعليقات
بسم الله الرحمن الرحيم
اليوم أحبابي في الله أحضرت لكم قالب خفيف وأنيق خاص بمدونة كمبيوتر العرب سأذكر بعض مميزاته 
  • يحتوي القالب على مكان لوضع إعلانات أدسنس في الجانب الأيسر من الهيدر.
  • صديق لمحركات البحث لأنه مجهز بميتا تاج.
  • ألوان القالب مريحة للعين.
  • متوافق مع جميع المتصفحات بما في ذلك إكسبلور.
  • يحتوي على صندوق لمشاركة التدوينة أسفل كل موضوع.
  • يحتوي كذلك على صندوق نبذة عن الكاتب أسفل كل تدوينة.
  • يحتوي على إضافة مواضيع ذات صلة بشكل متحرك.
  • يتميز بنظام تعليقات يدعم الرد.
  • يحتوي على زر الذهاب إلى الأعلى بالجي كويري.
  • يحتوي على قائمة علوية لإظهار الصفحات. 
  • خفيف في تصفحه حيث تم ضغط خصائص السي إس إس.
والعديد من المميزات الأخرى التي سأدعكم تكتشفونها بأنفسكم.
قالب سهل التركيب ماعليك سوى تغير معلومات الميتاتاج والصفحات الإجتماعية (الفيسبوك ،تويتر، ويوتيوب) وتغير معلومات عن الكاتب واللوجو حتى لا ننسى.
دمتم بود
إقرأ البقية

السبت، 22 فبراير 2014

نصائح قيمة إن كنت تفكر في تحقيق الأرباح من مدونات بلوجر

بقلم: BR MED يوم السبت، 22 فبراير 2014 القسم : 4 التعليقات
بسم الله الرحمان الرحيم
 لا يجب على المدونين الجدد أن يفكروا وأن يشغلوا دهنهم بأفكار الربح من الأنترنيت قبل أن يبني مدونته بطريقة صحيحة بحيث تكون مستوفاة لجميع الشروط التي ستجعلها مميزة لدى الزوار وذلك بمواضيعها الحصرية والتي تخلو من الركاكة و الأخطاء وبتصميمها الذي يجب أن يكون أنيق -(حول أن تضع قالب قليل ما تراه في مدونات أخرى)- وبالإضافة اللمسة الفنية الخاصة بك حيث طريقة وضع الصور و الألوان ...المهم لا تعمد على النقل يجب على مدونتك أن تكون مرآة لشخصيتك...للأسف بعد الأشخاص تصلهم فكرة  الربح من الأنترنيت قبل كل شيئ  في ينشئ مدونة بمعايير ضعيفة في الأول يضع بعض المشاركات ولكن فكرة الربح من الأنترنيت تسيطر على دماغه فيبدي إهتمامه للربح ويترك أساس كل شيئ هذا ما يجعله  يقوم بنسخ محتوى غيره من ويضعه في مدوناته مباشرة حتى العنوان لا يغيره وفي الأخير يكتشف أنه لا ينجح في ذلك .
تكون مدونته غير مؤرشفة بشكل جيد أو غير مؤرشفة قطعا بسبب اكتشاف التكرار في محركات البحث ، ونفترض دخل الزائر إليها لن يلبث بداخلها حتى 10 ثواني موضوع في الشرق وأخر في الغرب ، أما إن كانت هناك كثرة  الإعلانات أو المنبثقة هذا شئ أخر ،للأسف سيرى صاحب المدونة الفشل محيط به من كل الجوانب.
يحتاج الربح من الإنترنت الى استراتيجية حقيقية ويجب ان تكون قادراً على انشاء مدونة ناجحة.
بإختصار أنظر لهذه المعادلة :
مدونة بتصميم راقي + مواضيع حصرية وبلمسة فنية منك + الإعلانات منظمة  = $$$$ آخر شهر 
لكن المسألة كلها عزم  و إرادة لم أقل صعبة ولكن العمل ثم العمل  و الإطلاع على تجارب الأخرين سيفيدك أكيد فعند زيارتك لمدونات أخرى ستستفيد من إيجابيات هذا وستتجنب أخطأ هذا وهكذا وفي الأخير سستجد مفتاح النجاح بإذن الله
- متى افكر ان اربح من بلوجر ؟
بمجرد ان تصبح مدونتك لها عدد جيد من المتابعين والزوار يمكنك ان تفكر في الربح  لكن لا تعطي للامر كثير من الأهمية لأن هذا سيستنفذ طاقتك وسيشغل عقلك وفي الغالب سياتي بنتيجة عكسية.
ومن أهم الشركات الربحية على الأنترنيت نجد "إعلانات حسوب"  و "إعلانات جوجل أدسنس" 
إقرأ البقية

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

بقلم: BR MED يوم القسم : 1 التعليقات
في هذا الدرس أحبابي في الله سوف نتعلم كيفية ترقيم صفحات مدونة بلوجر Page Navigation widget  بحيث تمكنك هذه الإضافة من تسهيل تصفح الزوار لصفحات مدونتك بسهولة، خصوصا بعد أن تكون المدونة ممتلئة بالمواضيع ، ولكن الكثير من الإضافات تكون معدلة وتناسب مدونة الشخص الذي صنع أنشاء ذلك الكود ، هذا يجعل الإضافة غير متناسقة مع باقي المدونات حسب الشكل والألوان ، ولكن اليوم أحضرت هذا الكود الذي يوفر لك امكانية إختيار تنسيق المفضل ليصبح مناسب لمدونتك...المهم كي لا أطيل عليكم.
1 - عاين صور النماذج التالية و إختر المناسب لك .
 النمودج الأول
 #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 12px;padding: 5px 12px;margin-right:5px; color: #222; background-color:#eee; border: 1px solid #EEEEEE;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#E5E5E5;text-decoration:none;color: #222;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#DB4920;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

النموذج الثاني
#blog-pager{clear:both;margin:30px auto; padding: 7px; text-align:center;font-size: 11px;background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #000000),color-stop(1, #292929));background-image: -o-linear-gradient(top, #000000 0%, #292929 100%);background-image: -moz-linear-gradient(top, #000000 0%, #292929 100%);background-image: -webkit-linear-gradient(top, #000000 0%, #292929 100%);background-image: -ms-linear-gradient(top, #000000 0%, #292929 100%);background-image: linear-gradient(to top, #000000 0%, #292929 100%); padding: 6px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 3px 10px;margin-right:5px; color: #fff;}
.displaypageNum a:hover,.showpage a:hover,.pagecurrent{background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #59A2CF),color-stop(1, #D9EAFF));background-image: -o-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -moz-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -webkit-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: -ms-linear-gradient(top, #59A2CF 0%, #D9EAFF 100%);background-image: linear-gradient(to top, #59A2CF 0%, #D9EAFF 100%);text-decoration: none;color: #000;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.showpageOf{display:none!important}.blog-pager-older-link, .home-link, .blog-pager-newer-link {background: transparent;}
a.blog-pager-older-link, a.home-link, a.blog-pager-newer-link {color: #fff;}
#blog-pager .pages{border:none;background: none;}

 
النموذج الثالث
#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 3px 7px;margin-right:5px;background:#E9E9E9;color: #888;border:1px solid #E9E9E9;}
.displaypageNum a:hover,.showpage a:hover,.pagecurrent{background:#CECECE;text-decoration:none;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .showpage, #blog-pager .pagecurrent{font-weight:bold;color: #888;}
 #blog-pager .pages{border:none;}
 النمودج الرابع
 #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 13px;padding: 5px 12px;margin-right:5px; color: #3E5801; background-color:#E0EDC1;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#FEF6DF;text-decoration:none;color: #E16800;}
#blog-pager .pagecurrent{font-weight:bold;color: #D25E71;background:#FFDEDF;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}

 النمودج الخامس
 #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #F4F4F4; background-color:#404042;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#EC8D04;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #000;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}
النمودج السادس
 #blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px; }
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 13px;padding: 5px 12px;margin-right:5px; color: #AD0B00; background-color:#FAB001;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#DB4920;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#DB4920;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;}
النمودج السابع
#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 14px;padding: 5px 12px;margin-right:5px; color: #666; background-color:#eee;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#359BED;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#359BED;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;} 
كما تلاحظون كل نمودج يوجد تحته أكواد الستايل الخاصة به
الأن جاء وقت التعديل 
2 - نذهب للوحة التحكم بلوجر ثم القالب نقوم بأخد نسخة إحطياطية كما تعودنا دائما.
نقوم بتحرير html ونبحث بالإستعانة بالزرين crtl+f عن الوسم:  </b:skin>
ونقوم لصق كود الستايل الخاص بأحد النماذج أعلاه.
3 - نقوم بالبحث عن الوسم : </body> ثم نضع فوقه مباشرة هذا الكود:
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
    var perPage=7;
    var numPages=6;
    var firstText ='البداية';
    var lastText ='النهاية';
    var prevText ='« السابق';
    var nextText ='التالي »';
    var urlactivepage=location.href;
    var home_page="/";
  /*]]>*/
</script>
  <script src="https://warch.googlecode.com/svn/trunk/blog-page/blog-page.js"/>
</b:if>
</b:if>
الرقم 7 يعني عدد الصفحات الظاهرة في الترقيم
الرقم 6 يعني عدد المواضيع المشاركات في الصفحة ، يجب جعلها بنفس عدد المشاركات التي قمت بوضعها في إعدادت المشاركات.
يمكنك إضافة هذا الكود لإخفاء أزرار "البداية" و "النهاية" وذلك في أكواد css.
 .firstpage, .lastpage {display: none;}
أما إن لاحظت وجود مشكلة في عدد المشاركات بصفحة التسميات في يمكنك مشاهدة هذا الموضوع حل مشكلة الترقيم و التسميات 
أي إستفسار أنا في الخدمة في أمان الله.
إقرأ البقية

الجمعة، 21 فبراير 2014

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

بقلم: BR MED يوم الجمعة، 21 فبراير 2014 القسم : 1 التعليقات
السلام عليكم ورحمة الله
إنشاء الله سنتعلم كيف نعدل الصفحات الثابتة في البلوجر "Blogger Static Pages" وجعلها بعرض المدونة، وهذا الإجراء يضفي جمالية على شكل الصفحات ، بالإضافة إلى أنه يسرع في تحميل محتوى الصفحة ويجعلها  خفيفة ، ومن بين الصفحات التي تستخدم فيها هذه التقنية صفحة إتصل بنا أو الخصوصية أو الفوتوشوب أونلاين ، فهرس المدونة ... غيرها من الخدمات الأخرى .
سنقوم أحبابي في الله بإزالة العمود الجانبي والتعليقات وجميع الإضافات الأخرى بحيث يبقى المجال فارغ لتوسع الصفحة ، 
طريقة التركيب:
  • أولا نذهب للوحة التحكم بلوجر ثم القالب.
  • نقوم بأخذ نسخة إحتياطية دائما لتفادي أي غلط  بالرغم من سهولة الشرح
  • بعد ذلك نقوم بالضغط على تحرير html و ننقر وسط الأكواد.
  • نبحث عن هذا الوسم ]]></b:skin> مستعينا بالزراين(ctrl+f).
  • ثم ضع فوقه هذا الكود مباشرة و قم بحفظ القالب.

    • قد تكون أكواد القالب موسعة قم بالبحث عن الوسم الثاني فقط أقصد: <b:skin/>
    تحته مباشرة تلصق الكود التالي:
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'><style>.sidebar,.comments,.footer {display:none;}#main-wrapper{width: 99%; float: none; margin: 0px auto;}html {overflow-x: hidden;}.post {width: 97%; margin: 15px auto;} .post h3 a { text-align: center; padding:5px;}</style></b:if>
    هذا الكود سيقوم بإخفاء العمود الجانبي Sidebar و التعليقات Comments و الجزء السفلي Footer
    من الصفحات الثابته هذا الكود سيعمل تقريبا مع غالبية القوالب.في حالة وجود إضافات أخرى ترغب في إخفائها قم بالتحديد عليها وإضافتها للأكواد التي شرحتها عملها ، ولكن انتبه !! لا تنسى الفاصلة والنقطة (.,) بين تلك الأسماء 
    أما بالنسبة ان أردت ظهور اي شيء يكفي مسحه من الكود مثلا التعليقات تود أن تظهر ستقوم بمسح comments وستظهر تلقائيا.
    هناك بعض القوالب لا تتناسق معها وتظهر المدونة مشوهة هذه للأسف.
    وهناك قوالب تختفي الإضافات أي الكود يعمل ولكن أبعاد الصفحة تبقى كما هي لا تتغير في هذه الحالة ستقوم بتغير الرقم 97 بالرقم 93
    وضع هذا الكود #content {width: 100%;}  فوق الوسم </style> في الكود أعلاه
    القوالب التي تحتوي على عمودين أيمن وأيسر لا أنصح بتطبيق الأمر عليه لإن النتيجة غالبا تكون سلبية .
    بالتوفيق للجميع، في أمان الله.
    إقرأ البقية

    إضافة شاحنة الفيس بوك لزيادة المعجبين بمدونتك

    بقلم: BR MED يوم القسم : 1 التعليقات

    بسم الله الرحمن الرحيم
     أهلا وسهلاً بكم من جديد على ورشة مدون طريق كل مدون الى النجاح اليوم سأشرح طريقة إضافة شاحنة فيسبوك على مدونتك من أجل زيادة عدد المعجبيك. حيث سيعجب زوار مدونتك بهذه الشاحنة و سيقومون بالضغط عليها و بالتالي سوف تكسب المزيد من المعجبين إليكم طريقة إضافتها.
    ثم بإضافة أداة html java script وضع هذا الكود داخل الإطار ثم إضغط حفظ
    الكود:
    <!--www.medosat99.blogspot.com--> <div style="position: fixed; z-index: 65535; left: 0px; bottom: -3px; width:100%;">
    <marquee><a href="https://www.facebook.com/mobisous" target="blank"> <abbr title="Follow us at Facebook"><img src="src="https://lh6.googleusercontent.com/-GkiFhqMMfJE/T9GGUsW6daI/AAAAAAAAADE/dTDsfOdWrJM/s69/I1.png"/> </abbr> </a> </marquee> </div>
    لا تنسى غير رابط صفحتي برابط صفحتك
    في أمان الله
    إقرأ البقية

    الخميس، 20 فبراير 2014

    وضع صندوق إعجابات الفيسبوك في بلوجر

    بقلم: BR MED يوم الخميس، 20 فبراير 2014 القسم : 3 التعليقات

    السلام عليكم ورحمة الله وبركاته
    من أبرز الوسائل المعتمدة لنشر وإشهار مواضيع المدونات هي الشبكات الإجتماعية أهمها الفيس بوك و يوتيوب، خصوصا الفيس بوك الذي يلعب دورا مهما في جلب الزوار لمدونتك ، ومن أجل كسب متفاعلين ومتابعين على الفيس بوك يلزمك أن تنشئ صفحة و بهذا الأخيرة سيتوصل متابعيك والمهتمين بجديد مدونتك دائما هذا ما سيضطرك الى وضع صندوق اعجابات الفيس بوك داخل مدونتك حيث هذه الخاصية تمكن الزائر إن أعجب بمواضيعك من الضغط على زر الإعجاب ليصله الجديد كلما قام بتصفح حسابه على الفيس بوك.
    ولتسهيل مهمة وضع صندوق الإعجابات ، أحضرت هذا الكود :
    تقوم بالذهاب للوحة التحكم ثم التخطيط ثم تضغط اختيار أداة ثم تختار "html java script" تلصق الكود وتضغط حفظ.
    <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fmobisous&amp;width&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false&amp;appId=249227661898598" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:258px;" allowtransparency="true"></iframe>
    <div style='text-align:centre;clear:both; margin:10px 0'></div>
    تقوم بتغير"mobisous" بإسم مستخدم صفحتك
    مثلا رابط صفحتي هكذا : http://www.facebook.com/mobisous
    أما الرقم "258" فهو عرض وإرتفاع الصندوق يمكنك التعديل عليه ليكون ملائما مع شكل القالب لديك
    في أمان الله
    إقرأ البقية

    كيفية حذف "سكرول بار" السفلي في بلوجر

    بقلم: BR MED يوم القسم : 3 التعليقات

    السلام عليكم ورحمة الله وبركاته ، في بعض الأحيان عندما ينشئ المبتدأ في التدوين مدونة جديدة يلاحظ شريط التمرير السفلي أو Scroll Bar في مدونته رغم أن عرض القالب مناسب مع عرض الشاشة ، ويرجع هذا أحيانا إلى بعض الإضافات خصوصا ، اليوم جئتكم بالحل، لدى كل من يعاني من هذه المشكلة أن يقوم بما يلي :
    البحث عن هذا الوسم :
     ]]></b:skin>
    وضع هذا الكود قبله مباشرة :
    html {overflow-x: hidden;}
    ثم تقوم بحفظ القالب ، وسيتم إزالة الشريط السفلي بنجاح
    في أمان الله.
    إقرأ البقية
    الاشتراك في: الرسائل (Atom)