يمكنك الان شراء مساحة اعلانية علي موقعنا معرفه المزيد

اعلان

طريقة انشاء صفحة المعاينة في بلوجر

شرح كيفية إنشاء صفحة معاينة القوالب او المواقع الخارجية داخل مدونتك على منصة بلوجر
الرجاء الانتظار 0 ثانية...
قم بالتمرير لأسفل وانقر فوق فتح الرابط للتوجيه
تم فحص وتجهيز الرابط

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

صفحة المعاينة في بلوجر

صفحة المعاينة في بلوجر

تعد صفحة المعاينة في المواقع المتخصصة في تحميل قالب بلوجر أمر مهم لأنها توفر للمستخدمين معاينه القالب قبل التحميل وبدون الخروج من الصفحه المقصودة. ومع ذلك، يواجه الكثيرون مشكلة في تحميل واستخدام القوالب الصحيحة بشكل صحيح. وهنا تأتي أهمية انشاء صفحة المعاينة أو Preview Page في إيضاح المظهر النهائي للقالب قبل التحميل والاستخدام.

ما أهمية انشاء صفحة المعاينة؟

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

طريقه انشاء صفحه معاينه Previewpage

اذا كنت تملك مدونة توفير تحميل قالب وتريد انشاء صفحه معاينة. اقدم اليكم هذا الكود الذي يقوم بتوفير معاينه القالب مع زر التحميل من نفس الصفحة.

لإنشاء صفحة معاينة في بلوجر، يمكن اتباع الخطوات التالية:
  1. اذهب الى الصفحه الرئيسيه Blogger.com.
  2. ثم اضغط على القائمه في الجانب الايمن واذهب الى الصفحات.
  3. قم بانشاء صفحه جديده واكتب اسمها Preview Page.
  4. من داخل الصفحه الذي انشاتها اضغط على تبويب HTML.
  5. الان قم بنسخ الكود التالي ولصقه في الصفحه واحفظ العمل.
<style>.blogMn{display:none;}.navS{display:none;}.footer{display:none;}.wvC{display:none;}.header{display:none;}.mobMn{display:none;}.brdCmb{display:none;}.pTtl{display:none;}#view{padding:0;margin:0;border:0;position:fixed;top:50px;left:0;right:0;bottom:0;width:100%;height:93%;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZHWDaHS8f4AcEbXlg_Y6Lv8vqj-ezB5Bamgi8pO1wYHfsRLohQ0K_7TPi3WiW4y7AcByk_NoUj9OQrOXdS3-dORSwqRhTpFffvcTNWHtCVRdm_FsHSQoQtuopPjDO-1BYXvUUi5IyTJk/s0/loader.gif)no-repeat center center;transition:all .4s ease-out;}#Preview-Page{width:100%;height:50px;top:0;left:0;background:var(--notifC);transition:var(--trans-1);color:white;font:normal 13px;z-index:99999;position:fixed;}.closebutton{background:var(--themeC) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMitzy6osEvFDx6yJc9rdIFOwTYIJqVCG6tbHKFmoS2N41r2IIrHDVooQhLV_Yc3IFS1Nbvl_6P7gPLjvE4fEzjMeTI9oyJyUARTk2oVQ8aF0c79eyPqyK5-TteWYArlQADdQDlPHES50/s0-rw/close.png)no-repeat 15px 50%;text-align:center;height:50px;padding:0 20px 0 50px;position:fixed;top:0;right:0;line-height:50px;cursor:pointer;color:white;}a.closebutton{color:white;text-decoration:none;}.closebutton:hover{background:#579c26 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMitzy6osEvFDx6yJc9rdIFOwTYIJqVCG6tbHKFmoS2N41r2IIrHDVooQhLV_Yc3IFS1Nbvl_6P7gPLjvE4fEzjMeTI9oyJyUARTk2oVQ8aF0c79eyPqyK5-TteWYArlQADdQDlPHES50/s0-rw/close.png)no-repeat 15px 50%;}.dlbutton:hover{background:#579c26 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcgkAy_4fJ-eGzDRgiEZTmu_lMkiMSINMn7gunO0IySm1Zxp5MsaxWquahG8CfLc4Q95qCtVoM53eyeTU6MbyM2wydW48V6BKYs-80s_p4zrTg5F2vACJL7pkfCVl62flFLz6lHqzwpH4/s0-rw/download.png)no-repeat 15px 50%;}.dlbutton,a.dlbutton{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcgkAy_4fJ-eGzDRgiEZTmu_lMkiMSINMn7gunO0IySm1Zxp5MsaxWquahG8CfLc4Q95qCtVoM53eyeTU6MbyM2wydW48V6BKYs-80s_p4zrTg5F2vACJL7pkfCVl62flFLz6lHqzwpH4/s0-rw/download.png)no-repeat 15px 50%;text-align:center;height:50px;padding:0 20px 0 55px;position:fixed;top:0;right:158px;line-height:50px;cursor:pointer;color:white;text-decoration:none;}.demologo,a.demologo{padding-left:30px;font-size:17px;font-weight:normal;text-transform:uppercase;line-height:50px;left:15px;position:fixed;color:white;text-decoration:none;}</style>
<script type='text/javascript'>
//<![CDATA[
function getQueryVariable(variable) {
  var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    if (pair[0] == variable) {
      return pair[1];
    }
  }
  return (false);
}
window.onload = function() {
 var url  = getQueryVariable("demo");
 var download  = getQueryVariable("dl")
 document.getElementById('view').src = url;
 document.getElementById('dl').href = download;
};
//]]>
</script>
<div id='Preview-Page'>
  <a class='demologo' href='https://www.mr-medo.net'>Homepage</a>
  <a class='dlbutton' href='' id='dl'>Download</a>
  <a class='closebutton' href='javascript:void(0)' onclick='document.getElementById('Preview-Page').style.display='none';document.getElementById('view').style.top='0';document.getElementById('view').style.height='100%''>Remove Frame</a>
</div>
<iframe id='view'/>

اداة مولد روابط صفحة المعاينة:

الان قم بنسخ العنوان التالي والتعديل عليه بروابط موقعك

https://mr-medo.net/p/preview.html?demo=https://about.mr-medo.net&dl=https://drive.google.com/drive

ينتهي هنا موضوعنا عن "طريقة انشاء صفحة المعاينة في بلوجر"، ونلتقي في موضوع جديد على مدونة مستر ميدو. دمتم في امان الله :)

عن الكاتب

عبدالحميد ميدو، مصمم فلاتر سنابشات ومنشئ محتوى رقمي بخبرة تزيد عن 7 سنوات. لدي شغف بأحدث التقنيات، اهتمامًا خاصًا بلغات البرمجة كـ Python, JS وCSS.

3 تعليقات

  1. للأسف لا تعمل بشكل صحيح.. أرجو إضافة أي تحديث الي المقال. وجزاك الله خيرا
    1. ما اسم القالب الذي تستخدمه ؟
  2. سلام عليكم.. لقد اشتريت نفس القالب لكن باللغه الانجليزيه كيف اسوي نفس موقعك باللغه العربيه
يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق.
1 -أ ن يكون التعليق خاص بمحتوى التدوينة ❗
2 - أن لا تضع أي روابط خارجية❗
3 - أي سؤال خارج محتوى التدوينة يتم حذفه ❗
4 - لإضافة كود برمجي حوله أولاً بمحول الأكواد.
5 - لضمان نشر تعليقك يلزمك مراجعة اتفاقية الإستخدام.
ملفات تعريف الارتباط
نستخدم ملفات تعريف الارتباط (Cookies) لفهم كيفية استخدامك لموقعنا وتحسين تجربتك في المحتوى والإعلانات. باستمرارك في تصفح الموقع، فإنك توافق على استخدامنا لملفات تعريف الارتباط وفقًا لسياسة الخصوصية لدينا.
Oops!
يبدو أن هناك خطأ ما في اتصالك بالإنترنت.
يرجى الاتصال بالإنترنت والبدء في التصفح مرة أخرى.
يرجى السماح بعرض الإعلانات
يبدو أنك تستخدم أداة لحظر الإعلانات Adblock.
نحن نعتمد على الارباح التي نحققها من الإعلانات كمصدر تمويل لموقعنا الإلكتروني.
Site is Blocked
Sorry! This site is not available in your country.