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

 

اليوم الدرس الاهم للبلوجر وهو درس  التعديل على القالب وعمل اقسام ونشر مشاركات للبلوجر

اولا كل الاكواد او الراوابط او الملفات ستجدونها بالاسفل ان لم تجدونها ضع تعليق بالاسفل  اوكي شباب

شاهد الشرح بالفيديو من هنا

المعاينة

تحميل الكود

التحميل

تحياتي لكم متابعينا 

ابو عمر زكارنة

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

اعضاء مدونة ابو عمر سوفت

اليوم ساقدم لكم شرح عمل بلوج من البداية للنهاية اوكي شباب 

اولا الشرح مقسم الى جزئين :

الجزء الاول:درس انشاء حساب جيميل وعمل مدونة ورفع القالب

الجزء الثاني: النشر على المدونة والتعديل على القالب 

نشوف الشرح بالفيديو الدرس الاول

الدرس الثاني 

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

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

معاينة




وللتركيب حول صندوق الكتابة من وضع تأليف الى وضع HTML



<div id="bp_toc">
<script type="text/javascript" src="https://cnmu.googlecode.com/svn/trunk/cnmu-index-map.js"></script>
<script src="http://cnmu.blogspot.com/feeds/posts/summary?alt=json-in-script&amp;max-results=500&amp;callback=loadtoc" type="text/javascript"> </script>
<style>
#bp_toc {
  font-family: arial;
  font-size: 14px;
  margin-bottom: 10px;
  margin-top: 28px;
  text-align: right;
  width: 100%;
}
#bp_toc a {text-decoration: none;}
.toc-note {
    background: #ddd ;
    border: 2px solid #BBB;
    padding: 5px 10px;
    position: relative;
    right: 2px;
    top: -13px;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    font-weight: bold;
    text-shadow: 4px 4px 4px #515151; }
.toc-header-col1, .toc-header-col2, .toc-header-col3 {
    background: #ddd;
    border: 1px solid #BBB;
    color: #000;
    padding: 2px 5px;
    font-size: 14px;
    font-weight: bold;
    border-radius: 10px; }
/*عناوين المواضيع */
.toc-header-col1 { width:58%;}
.toc-entry-col1 {
    background: #F6F6F6;
    border: 1px solid #ddd;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    padding-right: 8px; }
.toc-entry-col1:hover {
    background: #FDE3E6;
    border-color: #8A8B8B;
    transition: all 1s ease-out 0s; }
/*التاريخ*/
.toc-header-col2 {width: 11%;text-align: center; }
.toc-entry-col2 {
    background: #000;
    border: 1px solid #ddd;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    color: #fff;
    text-align: center; }
/*الأقسام*/
.toc-header-col3 {width:31%;}
.toc-entry-col3 {
    background: #9C0022;
    border: 1px solid #ddd;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    color: #fff;
    padding-right: 8px; }
.toc-entry-col3 a { color: #fff; }
.toc-entry-col3:hover {
    background: #3D5288;
    border-color: #8A8B8B;
    transition: all 1s ease-out 0s; }
 </style>
</div>








اول شئ نفعله هو استبدال http://cnmu.blogspot.com برابط مدونتك
بالنسبة للتنسيق لمن يرغب بالتعديل هاذين الكودين هما نوع وحجم الخط يمكنك تغيرهما بما تشاء
  font-family: arial;
  font-size: 14px;
 لكن طبعا كما قلت تكبير الخط قد يزيد من عرض الفهرس فإن لم تكن مساحة الموضوع لديك كبيرة قد يكون الفهرس شكله غير مضبوط
هذا هو #ddd لون خلفية  جملة عدد المواضيع
وهذا هو #BBB لون الإطار
 نفس الأمر في الثلاث الوان التالية الخلفية #ddd الإطار #BBB وهذا لون الخط #000 ولكنهم يخصون عناوين الأعمدة
بالنسبة لجزء
/*عناوين المواضيع */
اللونين الموجدان بالبداية هما الخلفية والإطار
ولونين النهاية المعلمان بالأزرق نفس الشئ لكن عند تمرير الماوس
جزء
/*التاريخ*/
الثلاث الوان هما الخلفية الإطار ولون الخط
جزء
/*الأقسام*/
الثلاث الوان الاولى الخلفية والإطار والخط
اللون #fff هو لون الروابط 
اللونين الملعمان بالأخضر في النهاية هما الخلفية والإطار عند مرور الماوس
ملحوظة أخيرة بخصوص النسب المعلمة باللون الوردي 58% 11% 31%
 هذه نسبة كل قسم من مساحة عرض الفهرس يمكنك زيادة حجم قسم او تقليلها بتغيير النسبة
لكن عند زيادة قسم يجب تقليل الآخرين بحيث يكون مجموع النسب كلها 100%
تم بحمد الله














 






 تحياتي لكم ابو عمر سوفت
مصطفى سوفت
0595676793
0595946331

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