عبد الهادي اطويل

يمكن عمل ذلك عن طريق إجراء تعديل على كود الإضافة المعنية (Widget)، وبالضبط في السطر الأول منها، فلو أخذنا على سبيل المثال الكود التالي من إضافة الهيدر:
<b:widget id='Header1' locked='true' title='Test blog (Header)' type='Header'>نلاحظ أن هناك وسوم لها قيم معينة، ومنها نجد الوسم التالي:
locked='true'وهو المسؤول عن فتح أو إغلاق الإضافة، حيث حينما تكون قيمة الوسم locked هي true فحينها لا يمكن حذفه أو تغيير مكانه، ولجعله قابلا للتعديل بالحذف أو تغيير المكان نغير قيمة locked إلى false.
أما عن أنواع الإضافات فيتم تعريفها في الكود أعلاه من خلال الوسم type، حيث نجد من بين الأنواع مثلا:
Header HTML LinkList List وغيرها، وعددها محدد من طرف منصة بلوجر، ويمكنك الاطلاع على شرح مفصل لما يتعلق بالإضافات وأنواعها في الرابط التالي:
http://www.bloggerdev.com/2014/09/Page-Elements-Sections-and-widgets.html
وأخيرا أنصحك أختي الكريمة وقبل خوض غمار تطوير قوالب بلوجر، أن تمنحي لنفسك بعض الوقت للتعرف على بنيته بالاطلاع على المراجع المتاحة، وبعدها ستتضح لك أمور كثيرة وسيصبح من السهل عليك التعامل بشكل أفضل مع كود القالب والتعديل عليه وفق الحاجة حسب الإمكانات التي تتيحها منصة بلوجر.
 

فكرت في طريقة جديدة من خلال css فقط، حيث نجعل css تخفي أول صورة في التدوينة فقط دون غيرها، وذلك عن طريق استعمال الكود التالي:
.post-body div.separator:first-of-type { display: none; }أضيفيه إلى أكواد css الخاصة بالقالب، وتحققي من عمله.
مرجع:
https://developer.mozilla.org/en-US/docs/Web/CSS/%3afirst-of-type

لدي قالب قمت بتطويره، أظهر في صفحته الرئيسية وأيضا في أرشيف الأقسام التدوينات على شكل صور مع عنوان كل تدوينة، ولإظهار أول صورة مرفوعة على كل تدوينة أستعمل لهذا الغرض دالة بلغة Javascript تظهر أول صورة مرفوعة للتدوينة، وفي حالة انعدام أي صورة تظهر صورة افتراضية من اختياري، والكود هو التالي:
<b:if cond='data:post.thumbnailUrl'> <a expr:href='data:post.url'> <script type='text/javascript'> //<![CDATA[ function bp_thumbnail_resize ( image_url, post_title ) { var image_size = 200; image_tag = ' <img src="'+image_url.replace('/s72-c/','/s'+image_size+'-c/')+'" alt="'+post_title+'"/>'; return image_tag; } //]]> </script> <script type='text/javascript'> document.write(bp_thumbnail_resize(&quot;<data:post.thumbnailUrl/>&quot;,&quot;<data:post.title/>&quot;)); </script></a> <b:else/> <a expr:href='data:post.url'><img src='https://lh4.googleusercontent.com/-fBKfc2PwUbU/VADt8j6Z0AI/AAAAAAAAFLU/Awb9GJAZKm0/s200/img-placeholder-bg.png' expr:alt='data:post.title' /></a> </b:if>بوضع الكود أعلاه في المكان المرغوب به في التدوينة، مثلا فوق عنوانها كما في تلك المدونة، ستظهر أول صورة في التدوينة، لكن يجب أخذ الأمور التالية بعين الاعتبار:
لتغيير أبعاد الصورة يجب تغيير قيمة المتغير image_size في الكود أعلاه حسب ليوافق طول الصورة الذي ترغبين فيه (في قالبي أظهر الصور بعدها 200 بيكسل في الطول). الكود أعلاه يظهر صورة مربعة دائما، حيث يقوم بتقطيعها وجعل طولها مساويا لارتفاعها، لذلك فعند تحديد الطول المرغوب فيه عن طريق المتغير image_size فإن الارتفاع يكون أيضا مساويا له مع تقطيع الصورة تلقائيا لتظهر الصورة غير مشوهة إذا لم تكن مربعة. في حالة الرغبة في عدم تقطيع الصورة تلقائيا، سيتوجب حينها تحديد الطول المرغوب فيه عن طريق المتغير image_zise لكن الارتفاع سيكون هو الارتفاع المناسب للطول مع الحفاظ على تناسب الأبعاد الأصلي للصورة (مثلا إذا كانت مربعة ستبقى مربعة، وإذا كانت مستطيلة ستبقى كذلك مستطيلة وهكذا...)، وسيتوجب تبعا لذلك إجراء تعديل بسيط على الكود أعلاه ليصبح كما يلي: <b:if cond='data:post.thumbnailUrl'> <a expr:href='data:post.url'> <script type='text/javascript'> //<![CDATA[ function bp_thumbnail_resize ( image_url, post_title ) { var image_size = 200; image_tag = ' <img src="'+image_url.replace('/s72-c/','/s'+image_size)+'" alt="'+post_title+'"/>'; return image_tag; } //]]> </script> <script type='text/javascript'> document.write(bp_thumbnail_resize(&quot;<data:post.thumbnailUrl/>&quot;,&quot;<data:post.title/>&quot;)); </script></a> <b:else/> <a expr:href='data:post.url'><img src='https://lh4.googleusercontent.com/-fBKfc2PwUbU/VADt8j6Z0AI/AAAAAAAAFLU/Awb9GJAZKm0/s200/img-placeholder-bg.png' expr:alt='data:post.title' /></a> </b:if>الكود أعلاه يظهر صورة افتراضية في حالة غياب صورة التدوينة هذا رابطها: https://lh4.googleusercontent.com/-fBKfc2PwUbU/VADt8j6Z0AI/AAAAAAAAFLU/Awb9GJAZKm0/s200/img-placeholder-bg.pngيمكنك إما تغييرها بصورة تناسب قالبك، أو في حالتك أقترح أن تتخلي عن ميزة الصورة الافتراضية التي تظهر عند عدم وجود صورة بالتدوينة، فيصبح الوضع هو أن تظهر أول صورة في التدوينة عند وجودها، وإلا فلا يظهر شيء، ولهذا يصبح الكود كالتالي:
<b:if cond='data:post.thumbnailUrl'> <a expr:href='data:post.url'> <script type='text/javascript'> //<![CDATA[ function bp_thumbnail_resize ( image_url, post_title ) { var image_size = 200; image_tag = ' <img src="'+image_url.replace('/s72-c/','/s'+image_size+'-c/')+'" alt="'+post_title+'"/>'; return image_tag; } //]]> </script> <script type='text/javascript'> document.write(bp_thumbnail_resize(&quot;<data:post.thumbnailUrl/>&quot;,&quot;<data:post.title/>&quot;)); </script></a> </b:if>مع ملاحظة أنه يجب فيه أيضا تغيير أبعاد الصورة حسب المرغوب فيه.
أنصحك أيضا بالاطلاع على الموضوع التالي (باللغة الإنجليزية) وهو يتطرق لمختلف الطرق المتاحة التي يمكن من خلالها استعمال صورة كصورة بارزة (كما في ووردبريس) بالنسبة للتدوينة:
http://www.bloggerplugins.org/2011/09/post-thumbnails-for-blogger.html

أقتبس لك الجواب من قاعدة المعرفة الخاصة بإعلانات حسوب:
المصدر:
http://support.hsoub.com/knowledgebase/add-website/ رابط قاعدة المعرفة الخاصة بإعلانات حسوب:
http://support.hsoub.com/section/hsoub-ads/

بالنسبة للتخطيط، فيمكن التحكم في مظهره عن طريق استغلال وسم خاص من نوع ID خاص بالتخطيط وهو:
#layoutأو:
body#layoutوبالتالي فكل عنصر في CSS أضيف قبله هذا الوسم سيؤثر في مظهره بالتخطيط، وغالب الظن أن هذا ما يحصل معك مع الشريط الانزلاقي (السلايدر)، لذلك أدعوك للبحث ضمن كود قالبك عن الوسم أعلاه والتحقق مما إذا كانت هناك أكواد css تتحكم في مظهر التخطيط.
مراحع:
http://ask.mybloggertricks.com/t/how-to-customize-blogger-layout-design/481/2 http://stackoverflow.com/questions/16546986/blogger-labeling-sections-on-the-layout-page

وعليكم السلام ورحمة الله وبركاته.
يمكنك استعمال الجمل الشرطية الخاصة بمنصة بلوجر في رأس القالب head لإجراء التعديل الذي ترغبين فيه. لأجل ذلك قومي بالتالي:
في ملف القالب ومباشرة قبل الوسم:
</head>أضيفي الكود التالي:
<b:if cond='data:blog.searchLabel == "LABEL"'> <style> body { background-image: url(DIRECT_LINK_TO_BACKGROUND_IMAGE); background-position: center; background-repeat: repeat; background-attachment: fixed; } </style> </b:if>مع ملاحظة أنه سيتوجب عليك إجراء التعديلات التالية على الكود أعلاه بما يناسبك:
تغيير LABEL إلى اسم التصنيف أو التسمية التي ترغبين في جعل الخلفية مختلفة عند زيارتها. تغيير DIRECT_LINK_TO_BACKGROUND_IMAGE إلى رابط مباشر لصورة من اختيارك إذا رغبت في جعل الخلفية صورة، أو يمكنك تخصيص ذلك الكود الخاص بوسوم CSS بما يناسبك، لأنني أفترض أنه لديك خبرة في التعامل مع CSS طالما تعملين على تطوير قالب بلوجر. سيكون عليك تكرار ذلك الكود حسب التسميات التي لديك في المدونة.
مصادر:
http://helplogger.blogspot.com/2012/04/how-to-add-different-backgrounds-in.html http://www.bloggersentral.com/2010/08/targeting-specific-pages-with.html http://stackoverflow.com/questions/16592681/blogger-url-condition-statements https://gist.github.com/oliverdoetsch/153334604fdda9fe9191