كيف أنقل أول صورة في التدوينة إلى مكان آخر في المدونة تلقائيا على منصة بلوجر؟

فكرت في طريقة جديدة من خلال css فقط، حيث نجعل css تخفي أول صورة في التدوينة فقط دون غيرها، وذلك عن طريق استعمال الكود التالي:

.post-body div.separator:first-of-type {
	display: none;
}

أضيفيه إلى أكواد css الخاصة بالقالب، وتحققي من عمله.

مرجع:

https://developer.mozilla.org/en-US/docs/Web/CSS/%3afirst-of-type

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

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

أما فيما يخص حذف أو إخفاء أول صورة من التدوينة، فإن حذفها لا ينصح به، لأنها إذا حذفت من التدوينة فلن يكون بالإمكان أصلا إظهارها بمكان آخر بالتدوينة، لذلك سوف نتحدث عن إخفائها تجنبا لتكرار ظهورها بالتدوينة نفسها.
إخفاء أول صورة لن يكون عملا تلقائيا بشكل كامل، بل سيتوجب معه إجراء تعديل بسيط على كود الصورة بعد إضافتها للتدوينة، حيث بعد إضافة الصورة للتدوينة ننقر على تبويب HTML من خلال المحرر، ثم نضيف وسما css إلى الصورة مثلا: hide-pic، ويكون ذلك من خلال إجراء تعديل طفيف على كود الصورة الذي يبدأ في العادة بالكود التالي:

<div class="separator" style="clear: both; text-align: center;">

وكل ما علينا فعله أن نغير الوسم separator بوسمنا hide-pic ليصبح السطر أعلاه كما يلي:

<div class="hide-pic" style="clear: both; text-align: center;">

وكل ما علينا فعله الآن هو إضافة كود إلى css الخاص بالقالب للتحكم في الوسم hide-pic وجعل الصورة تختفي متى أضفنا إليها ذلك الوسم، وهذا مقال عن كود css الكفيل بإخفاء الصورة:

.hide-pic {
	display: none;
}

هذا ما في جعبتي بخصوص هذا السؤال

شكرا اخي 

لكن اريد اخفاء تلقائي  

أفضل اجابة بلا منازع 

شكرا  
كل الاحترام