طريقة اخفاء واظهار محتوى من الموضوع داخل مواضيع بلوجر
طريقة اخفاء واظهار المحتوى والنصوص وغيرها بزر إظهار المزيد داخل مواضيع بلوجر
طريقة اخفاء واظهار المحتوى بزر نسميه مثلا إظهار المزيد ليظهر لنا محتوى يكون مخفيا في الأول ثم يصبح مرئيا عندما يضغط الزائر على زر إظهار المزيد داخل نفس الموضوع ببلوجر
خدعة ظريفة لعمل محتوى مخفي أو بالتحديد / محتوى قابل للإظهار والإخفاء Hide and show
وتفيد هذه الطريقة في المدونات التي تكون مواضيعها طويلة فيمكن إستخدامها لإخفاء جزء من الموضوع أو للمدونات التي تكتب القصص او المحتويات التشويقية كأن تكتب قصة وعند الوصول لجزء معين تخفيه أو تخفي صورة أى شئ واستخدامها كما تحب ولكن لا تستخدمها فيما يغضب الله عز وجل.
شرح طريقة اخفاء واظهار محتوى من الموضوع داخل مواضيع بلوجر
ولتطبيقها تابع الشرح..
تقوم بإضافتها في المواضيع التي تريد إخفائها وهي كالتالي :
قم بكتابة موضوعك بالطريقة العادية وبعد الإنتهاء حول صندوق المواضيع من وضع التأليف الى وضع HTML
طبيعي انت تريد جزء ظاهر وجزء مخفي لذا قبل الجزء من المحتوى الذي تريده مخفياً قم بوضع الكود التالي:
<div id="spoiler" style="display:none">
وعند نهاية الجزء الذي تريد إخفائه ضع الكود التالي:
</div>
الآن كل ما هو موجود بين الكودين السابقين سيكون خفيا أو سيختفي عند عرض الموضوع..
بقي أمر واحد وهو وضع زر لإظهار وإخفاء المحتوى السابق ..
قم بإضافة الكود التالي قبل الكود الاول إن أردت الزر الخاص بالإخفاء والإظهار للمحتوى في الأعلى أو بعد الكود الثاني إن أردت الزر في الأسفل..
**************************************************************
<br />
<center>
<button id="cnmuhide" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">أكمل الموضوع [ إظهار ] [ إخفاء ]</button>
</center>
<br />
**************************************************************
التعديلات على زر الإخفاء والإظهار لللمحتوى داخل مواضيع بلوجر
يمكنك تعديل الجزء الاحمر بكتابة اى جملة تعجبك مثلا: أكمل الموضوع /المزيد /تفاصيل....الخ
كما يمكنك تعديل الجزء الملون بالأزرق بما تريد أو أتركه كما هو مثلا [ إظهار ] [ إخفاء ] او [ عرض ] [تقليص ]...الخ
مثال على طريقة اخفاء واظهار محتوى من الموضوع داخل مواضيع بلوجر
هذا نفس الكود السابق لإظهار وإخفاء المحتوى لاكنني عدلته ليناسب موضوع نشرته حول فيديو لليوتيوب ليتناسب معه.. ، يمكنك إستعماله...
**************************************************************
<center>
<button id="cnmuhide" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}" style="background-color: #3f51b5; color: #eeeeee; width: 100%;" type="button"> عرض المزيد [ إظهار ] [ إخفاء ]</button>
</center>
<div id="spoiler" style="display: none;">
المحتوى الذي سيتم اخفاؤه
</div>
**************************************************************
وسيظهر معك هكذا..
لأي إستفسار يمكنكم التواصل معنا
والسلام عليكم ورحمة الله تعالى وبركاته