9/26/2017

settings_overscan print announcement

إنشاء سجل للزوارguest book بإستخدام قاعدة firebase مشروع إحترافي و جديد ..هو من بين المشاريع المتواضعة التي تقدمها مدونة بلوجر كود لزوارها الأفاضل لكي تتميز مدوناتهم وتتألق .. ربما تستنكر العنوان للوهلة الأولى بما أننا نعلم أن منصة firebase  هي بيئة برمجة تساعد على بناء تطبيقات لأنظمة Android وios بالإضافة إلى الويب في المستوى العالي والمحدود.
لكن مانحتجه في هذا المشروع كالعادة  خدمات التخزين والاستضافة مثل أداة عدد مشاهدة التدوينة وعدد مرات التحميل  لكن هذه المرة سنعدلها لنحصل على ميزة التراسل أو رفع تقارير المشاكل والأخطاء وغيرها...ننتقل بكم إلى المعاينة المباشرة ثم بعدها نريكم طريقة التخصيص ... (لاتنسى ترك بصمتك على سجلنا حتى نتشرف بمروركم الكريم ).




مميزات هذه الأداة

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


ماذا تحتاج لتضمين هذه الأداة في مدونتك؟

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


مرحلة إنشاء قاعدة بيانات على موقع firebase

ليكن في العلم أن إنشاء قاعدة بيانات على موقع Firebase يشترط إنشاء حتى 5 قواعد بيانات لحساب واحد ..الآن بعد التوجه إلى موقع firebase.google.com ثم التسجيل من خلال حساب Gmail الخاص بك  سنقوم بإنشاء قاعدة بيانات خاصة بسجل التعليقات.

واجهة بداية العمل




إنشاء التطبيق 



الآن ستنبثق لك نافذه على الشكل التالي...


  1. CREATE PROJECT
  2. - في الخانة الأولى نكتب إسم التطبيق بالأحرف الأنجليزية ( إحفظ إسم التطبيق لأننا سنحتاجه في الأخير) 
  3. -في الخانة الثانية نختار الدولة التابع لها.
  4. -وأخيرا نضغط على الزر CREATE PROJECT

تفعيل التطبيق

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



بعد الضغط على قسم   Database  ستفتح معنا واجهة تفعيل التطبيق على الشكل التالي...



- ركز معي!! ...

الذي أمامك هو شفرة إعطاء الصلاحية للتطبيق بتحميل المعلومات داخل قاعدة تخزين البيانات  والتي حجمها حوالي 5GB  .
وكما نلاحظ هنا إسم التطبيق الذي أنشأناه ...لكن أمامه كلمة  null
 سنقوم بضبط الإعدادات كالتالي...
سنقوم بتغيير الشفرة null بالشفرة true تضغط على الكلمة ثم تقوم بإعادة التسمية ثم تضغط على زر الإدخال  Enter بلوحة المفاتيح ويجب ان تتأكد أن الكلمة تغيرت كما في الصورة التالية تماماً..



- الآن المرحلة النهائية والتي لاتقل أهمية عن سابقتها...ماسنقوم به هو الإنتقال إلى التعديل على شفرة اخرى بنفس العملية أنظر الصورة التالية ...



- بعد الضغط على تبويب RULES سنحصل على كود صغير يحتوي على نفس الشفرة null  التي سبق وعدلنا عليها ماسنقوم به هو تغييرها كذلك بالشفرة true  وستلاحظ ظهور زر بإسم  PUBLISH   دور هذا الزر هو حفظ التعديلات ستقوم بالضغط عليه عند إنتهائك من العمل ... انظر الشكل النهائي للعمل في الصورة التالية ...


تسهيلا للعملية تستطيع حذف الكود الذي تجده ثم ضع هذا الكود التالي مكانه

 {
  "rules": {
    ".read": "true",
    ".write": "true"
  }
} 



مرحلة تركيب أداة سجل الزوار في المدونة


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

التوجه إلى المدونة

  • قم بتسجيل حسابك ثم إذهب إلى منصة البلوجر dashboard
  • إنتقل للمدونة >> ثم إلى الصفحات >> صفحة جديدة >> ثم إنتقل إلى تبويب  HTML  
  • ستقوم أولا بتعطيل صندوق التعليقات من على الصفحة الجديدة وذلك بالضغط على خيارات ثم حدد على الخيار عدم السماح، إخفاء التعليقات الحالية كما في الصورة
  • بإستعمال  الزر  C +Ctrl  للنسخ و  V +Ctrl  للصق قم بوضع الكود التالي داخل حقل الصفحة

  <div id="guestbook-ba88" dir="rtl">
  <div id="guestbook-main">
      <div class="row">
       <div class="col s12 m12 l5">
        <div class="card blue-grey darken-1">
   <div class="card-title">
<div class="advertisementblogcode01">
<a href="https://mail.google.com/mail/?ui=2&amp;view=cm&amp;fs=1&amp;tf=1&amp;to=example@gmail.com&amp;su=[Guestbook]
&amp;body=Message to Supervisor:blogger/The required link:[url]" rel="nofollow" target="_blank" title="Reporting">
<i aria-hidden="true" class="fa fa-exclamation-triangle"></i>
</a>
</div>
   <h5><i class="fa fa-heart" aria-hidden="true"></i>
              مرحبا بكم في سجل الزوار
            </h5>
   </div>
            <div class="card-content white-text">
            <b>تم إنشاء هذه الصفحة خصيصا لزوارنا ومتابعينا الأفاضل ليدلو بأرائهم حول هذه المدونة وترك إنطباع نتشرف بعطره
   <br>
             ها أنت ذا!..فاكتب كيف تجد المدونة ؟.. نحتاج نصيحتك ؟.. أواكتب ان شئت نقدك ؟ المهم نحافظ على العرف والأصول
   </b>    
            <br>
<div class="item-general-info">
<h1>يشرفنا رأيكم، لكن يرجى مراعاة الشروط التالية لضمان عدم حذف التعليق</h1>
<ul>
<li>
يرجى كتابة عبارات مفهومة باللغة العربية تصف المحتوى
</li>
<li>
تجنب وضع روابط أو عبارات إشهارية
</li>
<li>
عدم وضع أكثر من تعليق واحد
</li>
<li>
أنت لست مرغم على إضافة بريدك الإلكتروني
</li>
<li>
رجاءا إذا لاحظت أي إنتهاك يرجى إستعمال زر التبليغ
</li>
</ul>
</div>  
       </div>
        </div>
         <div class="panel-heading">
           <h3>لا تتردد في ترك بصمتك أدناه!</h3>
         </div>
          <form id="form">
            <label for="form__name"><i class="fa fa-user-circle-o" aria-hidden="true"></i> الإسم الكريم (ضروري)</label>
            <input type="text" id="formname" name="name" required="required" placeholder="أكتب الإسم..."/>
            <br>
            <label for="form__email"><i class="fa fa-at" aria-hidden="true"></i> البريد الإلكتروني (إختياري)</label>
            <input type="email" id="formemail" name="email" placeholder="أدخل بريدك الإلكتروني..."/>
            <br>
            <label for="form__message"><i class="fa fa-commenting" aria-hidden="true"></i> عبر عن رأيك (ضروري)</label>
            <textarea type="text" id="formmessage" name="message" required="required" placeholder="أكتب تعليقك..."/></textarea>
            <br>
            <input type="submit" value="إرسال التعليق" onclick=""/>
        </form>
       </div>
      <div class="col s12 m12 l7 messages">
         <div class="light-table-filter-search">
    <input type="search" class="light-table-filter" data-table="order-table" placeholder="أدخل أية حروف دلالية..." />
         </div>
         <div class="card blue-grey darken-1">
           <div class="card-content white-text">
               <span class="card-title">
                <table class="order-table">
                <tbody id="messageDiv"></tbody>
                </table>
               </span>
           </div>
         </div>
       </div>
     </div>
    </div>
  <div id='Createdbybloggcode'></div>
</div>
<style>
#guestbook-ba88{position:relative;overflow:hidden;display:block;margin:0 auto;max-width:1280px;width:100%;}
#guestbook-main{padding:20px;position:relative;overflow:hidden;background-color:#eaeaea;}
#guestbook-ba88 .row{margin-left:-0.75rem;margin-right:-0.75rem;}
#guestbook-ba88 .row .col.s12{width:100%;margin-left:auto;left:auto;right:auto;}
#guestbook-ba88 .row .col{position:relative;float:right;box-sizing:border-box;padding:0 0.35rem;}
#guestbook-ba88 .card{background-color:#ffffff!important;}
#guestbook-ba88 .blue-grey.darken-1{max-height:900px;overflow:auto;}
#guestbook-ba88 .card .card-content{padding:10px;border-radius:0 0 2px 2px;background-color:white;text-align:right;}
#guestbook-ba88 .card .card-content .card-title{line-height:48px;}
#guestbook-ba88 .row .col.l5 .card-title{padding:15px;font-weight:300;overflow:hidden;position:relative;display:block;background-color:#f79029;text-align:right;}
/*===white-text===*/
#guestbook-ba88 .card-content.white-text{position:relative;overflow:hidden;display:block;}
.item-general-info{color:#777;padding:0;margin:0;display:block;overflow:hidden;position:relative;}
.item-general-info ul li{position:relative;text-align:right;font-size:11px;list-style:none;}
.item-general-info ul li:before{content:"\f00c";font:normal normal normal 14px/1 FontAwesome;position:relative;z-index:2;color:#bbbbbb;margin-left:5px;padding:0.5em;background-color:#eaeaea;display:inline-block;text-align:center;}
/*===card-panel===*/
#guestbook-ba88 .card-panel{background-color:#eaeaea!important;position:relative;color:#656565!important;font-size:17px;display:block;font-weight:700;padding:10px;margin:0.5rem 0 1rem 0;text-align:right;}
#guestbook-ba88 .card-panel span{display:block;font-size:14px;color:#656565!important;line-height:normal;}
#guestbook-ba88 .card-panel i,#guestbook-ba88 .card-panel em{font-size:30px;margin:0 10px;color:#f79029;}
#guestbook-ba88 .card-panel em{font-size:17px;font-style: italic;}
#guestbook-ba88 table.order-table,#guestbook-ba88 tbody#messageDiv{width:100%;}
/*===tools===*/
.input-field{position:relative;margin-top:1rem;}
:focus{outline:0;}
input,input:hover,input:active,input:focus:active,textarea:focus{outline:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
label,select,button,.btn,input[type="radio"],input[type="checkbox"],input[type="button"],input[type="submit"]{cursor:pointer;}
#guestbook-ba88 input:not([type]),#guestbook-ba88 input[type=text], #guestbook-ba88 input[type=password], #guestbook-ba88 input[type=email], #guestbook-ba88 input[type=url], #guestbook-ba88 input[type=time], #guestbook-ba88 input[type=date], #guestbook-ba88 input[type=datetime-local], #guestbook-ba88 input[type=tel], #guestbook-ba88 input[type=number], #guestbook-ba88 input[type=search], #guestbook-ba88 input[type="submit"], #guestbook-ba88 textarea{resize:vertical;position:relative;background-color:#FFFFFF;border:none;border-bottom:3px solid #e0e0e0;outline:none;height:3.6rem;width:100%;font-size:1rem;font-weight:700;margin:0 0 15px 0;padding:0;box-shadow:none;box-sizing:content-box;transition:all .3s;line-height:normal;color:inherit;font:inherit;text-indent:15px;}
#guestbook-ba88 #form label{text-align:right;width:100%;display:block;margin:0;background-color:#f79029;color:white;font-weight:700;padding:0 5px;text-indent:5px;}
#guestbook-ba88 #form input[type="submit"]{background-color:#f79029;color:#ffffff!important;border:1px solid transparent;font-weight:700;}
#guestbook-ba88 #form input[type="submit"]:hover{background-color:#dcdcdc;}
/*===filter-search===*/
#guestbook-ba88 .light-table-filter-search{position:relative;overflow:hidden;margin:0;margin-bottom:10px;}
#guestbook-ba88 .light-table-filter-search input.light-table-filter{margin: 0!important;}
/*===h3 + h5===*/
#guestbook-ba88 h1{background:none;font-weight:700;text-align:right;padding:5px;margin:14px 0;border-right:3px solid #bbbbbb;color:#f79029;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:right;font-size:14px;line-height:normal;}
#guestbook-ba88 h3{font-size:1.2em;background-color:#ffffff;color:#f79029;display:block;border:1px solid #ffffff;padding:7px;text-align:center;}
#guestbook-ba88 h5{background:none;color:#FFFFFF;font-weight:700;font-size:1em;line-height:normal;margin:0;padding:0;}
#guestbook-ba88 b{margin:0 5px;color:#777;font-size:13px;text-align:right;line-height:normal;font-weight:normal;}
/*===:before +:after ===*/
*,*:after,*:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
#guestbook-ba88 h3:before,.light-table-filter-search:after{font:normal normal normal 14px/1 FontAwesome;}
#guestbook-ba88 h3:before{content:"\f27b";font-size:1.2em;position:relative;color:#f79029;margin:8px;}
.light-table-filter-search:after{content:"\f002";font-size:1em;position:absolute;text-align:center;top:0;left:0;height:100%;width:50px;line-height:3.5em;z-index:9;color:#FFFFFF;background-color:#f79029;}
/*=== advertisemen CSS/style 01 + add ===*/
.advertisementblogcode01{position:absolute;overflow:hidden;display:inline-block;top:0;left:0;margin:5px;}
.advertisementblogcode01 a{width:40px;height:40px;padding:5px;margin:5px;position:relative;color:#FFFFFF;background:#f79029;font-size:1.1rem;text-transform:uppercase;font-weight:700;display:inline-flex;justify-content:center;align-items:center;line-height:1;vertical-align:baseline;text-align:center;cursor:pointer;z-index:2;}
.advertisementblogcode01:after{pointer-events:none;content:'';position:absolute;width:100%;height:100%;top:0;right:0;background:rgba(0,0,0,.1);-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);}
.advertisementblogcode01 a:before{display:none;}
.advertisementblogcode01:hover:after{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);}
.advertisementblogcode01 a,.advertisementblogcode01:after{border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;-o-border-radius:100%;-ms-border-radius:100%;}
/* transition */
.advertisementblogcode01 a,.advertisementblogcode01:after{-webkit-transition:all .5s;-moz-transition:all .5s;-ms-transition:all .5s;-o-transition:all .5s;transition:all .5s;}
/*===border===*/
#guestbook-ba88 .row .col.l5 .card-title,.light-table-filter-search:after,#guestbook-ba88 #form label{border-bottom:3px solid rgba(0,0,0,0.09);}
/*===border-radius===*/
label,#guestbook-ba88 h1,#guestbook-ba88 h3,#guestbook-ba88 h5{border-radius:0;-o-border-radius:0;-ms-border-radius:0;-moz-border-radius:0;-webkit-border-radius:0;}
#guestbook-ba88 #form input,#guestbook-ba88 #form textarea{border-radius:0 0 .25em .25em;-o-border-radius:0 0 .25em .25em;-ms-border-radius:0 0 .25em .25em;-moz-border-radius:0 0 .25em .25em;-webkit-border-radius:0 0 .25em .25em;}
#guestbook-ba88 .card-panel,#guestbook-ba88 #form input[type="submit"]{border-radius:.25em;-o-border-radius:.25em;-ms-border-radius:.25em;-moz-border-radius:.25em;-webkit-border-radius:.25em;}
/*===box-shadow===*/
#guestbook-ba88 .card .card-content{-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.1);-moz-box-shadow:0 1px 4px rgba(0,0,0,0.1);-ms-box-shadow:0 1px 4px rgba(0,0,0,0.1);-o-box-shadow:0 1px 4px rgba(0,0,0,0.1);box-shadow:0 1px 4px rgba(0,0,0,0.1);}
/*===Page Responsive===*/
@media only screen and (min-width:601px){#guestbook-ba88 .row .col.m12{width:100%;margin-left:auto;left:auto;right:auto;}}
@media only screen and (min-width:993px){#guestbook-ba88 .row .col.l5{width:41.6666666667%;margin-left:auto;left:auto;right:auto;}#guestbook-ba88 .row .col.l7{width:58.3333333333%;margin-left:auto;left:auto;right:auto;}}
  </style>
<script src='//cdn.firebase.com/v0/firebase.js' type='text/javascript'></script>

<script>
//<![CDATA[
//Firebase
var submissionsRef = new Firebase('https://example.firebaseio.com/');
var _0x560d=["\x23\x66\x6F\x72\x6D","\x70\x72\x65\x76\x65\x6E\x74\x44\x65\x66\x61\x75\x6C\x74","\x73\x65\x72\x69\x61\x6C\x69\x7A\x65\x41\x72\x72\x61\x79","\x76\x61\x6C","\x23\x66\x6F\x72\x6D\x6E\x61\x6D\x65","\x23\x66\x6F\x72\x6D\x65\x6D\x61\x69\x6C","\x23\x66\x6F\x72\x6D\x6D\x65\x73\x73\x61\x67\x65","\u062E\u0637\u0623\x20\u0639\u0646\u062F\x20\u0625\u0631\u0633\u0627\u0644\x20\u0627\u0644\u0628\u064A\u0627\u0646\u0627\u062A\x3A\x20","\x6D\x65\x73\x73\x61\x67\x65","\x61\x6C\x65\x72\x74","\u062A\u0645\u062A\x20\u0625\u0636\u0627\u0641\u0629\x20\u0627\u0644\u0645\u0639\u0644\u0648\u0645\u0627\u062A\x20\u0627\u0644\u062A\u0627\u0644\u064A\u0629\x20\u0625\u0644\u0649\x20\u0633\u062C\u0644\x20\u0627\u0644\u0632\u0648\u0627\u0631\x2E\x2E\u0634\u0643\u0631\u0627\x3A\x20\x0A","\x73\x74\x72\x69\x6E\x67\x69\x66\x79","\x70\x75\x73\x68","\x72\x65\x73\x65\x74","\x73\x75\x62\x6D\x69\x74","\x72\x65\x6D\x6F\x76\x65","\x63\x68\x69\x6C\x64","\x63\x68\x69\x6C\x64\x5F\x61\x64\x64\x65\x64","\x69\x6E\x6E\x65\x72\x48\x54\x4D\x4C","\x6D\x65\x73\x73\x61\x67\x65\x44\x69\x76","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x3C\x74\x72\x3E\x3C\x74\x64\x20\x63\x6C\x61\x73\x73\x3D\x22\x63\x61\x72\x64\x2D\x70\x61\x6E\x65\x6C\x22\x3E\x3C\x69\x20\x63\x6C\x61\x73\x73\x3D\x22\x66\x61\x20\x66\x61\x2D\x73\x6D\x69\x6C\x65\x2D\x6F\x22\x20\x61\x72\x69\x61\x2D\x68\x69\x64\x64\x65\x6E\x3D\x22\x74\x72\x75\x65\x22\x3E\x3C\x2F\x69\x3E","\x6E\x61\x6D\x65","\x3C\x65\x6D\x3E\u064A\u0642\u0648\u0644\x3A\x3C\x2F\x65\x6D\x3E\x3C\x73\x70\x61\x6E\x3E","\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x2F\x74\x64\x3E\x3C\x2F\x74\x72\x3E","\x6F\x6E","\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x62\x6C\x6F\x67\x67\x2D\x63\x6F\x64\x65\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x22\x20\x72\x65\x6C\x3D\x22\x64\x6F\x66\x6F\x6C\x6C\x6F\x77\x22\x20\x74\x61\x72\x67\x65\x74\x3D\x22\x5F\x62\x6C\x61\x6E\x6B\x22\x20\x74\x69\x74\x6C\x65\x3D\x22\u0645\u0646\x20\u0637\u0631\u0641\x20\u0628\u0644\u0648\u062C\u0631\x20\u0643\u0648\u062F\x22\x20\x73\x74\x79\x6C\x65\x3D\x22\x64\x69\x73\x70\x6C\x61\x79\x3A\x20\x69\x6E\x6C\x69\x6E\x65\x2D\x62\x6C\x6F\x63\x6B\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x6F\x76\x65\x72\x66\x6C\x6F\x77\x3A\x20\x68\x69\x64\x64\x65\x6E\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x70\x6F\x73\x69\x74\x69\x6F\x6E\x3A\x20\x61\x62\x73\x6F\x6C\x75\x74\x65\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x7A\x2D\x69\x6E\x64\x65\x78\x3A\x20\x39\x39\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x66\x6F\x6E\x74\x2D\x73\x69\x7A\x65\x3A\x20\x31\x65\x6D\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x62\x6F\x74\x74\x6F\x6D\x3A\x20\x30\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x6C\x65\x66\x74\x3A\x20\x30\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x6D\x61\x72\x67\x69\x6E\x3A\x20\x31\x30\x70\x78\x20\x21\x69\x6D\x70\x6F\x72\x74\x61\x6E\x74\x3B\x22\x3E\x3C\x69\x20\x63\x6C\x61\x73\x73\x3D\x22\x66\x61\x20\x66\x61\x2D\x68\x65\x61\x72\x74\x22\x20\x73\x74\x79\x6C\x65\x3D\x22\x63\x6F\x6C\x6F\x72\x3A\x20\x23\x63\x65\x33\x65\x33\x65\x3B\x22\x3E\x3C\x2F\x69\x3E\x3C\x2F\x61\x3E","\x68\x74\x6D\x6C","\x23\x43\x72\x65\x61\x74\x65\x64\x62\x79\x62\x6C\x6F\x67\x67\x63\x6F\x64\x65","\x6C\x65\x6E\x67\x74\x68","\x23\x43\x72\x65\x61\x74\x65\x64\x62\x79\x62\x6C\x6F\x67\x67\x63\x6F\x64\x65\x3A\x76\x69\x73\x69\x62\x6C\x65","\x68\x72\x65\x66","\x6C\x6F\x63\x61\x74\x69\x6F\x6E","\x68\x74\x74\x70\x3A\x2F\x2F\x62\x6C\x6F\x67\x67\x2D\x63\x6F\x64\x65\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x2F","\x72\x65\x61\x64\x79","\x75\x73\x65\x20\x73\x74\x72\x69\x63\x74","\x70\x72\x6F\x74\x6F\x74\x79\x70\x65","\x74\x61\x72\x67\x65\x74","\x64\x61\x74\x61\x2D\x74\x61\x62\x6C\x65","\x67\x65\x74\x41\x74\x74\x72\x69\x62\x75\x74\x65","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x73\x42\x79\x43\x6C\x61\x73\x73\x4E\x61\x6D\x65","\x74\x42\x6F\x64\x69\x65\x73","\x72\x6F\x77\x73","\x63\x61\x6C\x6C","\x66\x6F\x72\x45\x61\x63\x68","\x74\x6F\x4C\x6F\x77\x65\x72\x43\x61\x73\x65","\x74\x65\x78\x74\x43\x6F\x6E\x74\x65\x6E\x74","\x76\x61\x6C\x75\x65","\x64\x69\x73\x70\x6C\x61\x79","\x73\x74\x79\x6C\x65","\x69\x6E\x64\x65\x78\x4F\x66","\x6E\x6F\x6E\x65","\x74\x61\x62\x6C\x65\x2D\x72\x6F\x77","\x6C\x69\x67\x68\x74\x2D\x74\x61\x62\x6C\x65\x2D\x66\x69\x6C\x74\x65\x72","\x6F\x6E\x69\x6E\x70\x75\x74","\x72\x65\x61\x64\x79\x73\x74\x61\x74\x65\x63\x68\x61\x6E\x67\x65","\x72\x65\x61\x64\x79\x53\x74\x61\x74\x65","\x63\x6F\x6D\x70\x6C\x65\x74\x65","\x69\x6E\x69\x74","\x61\x64\x64\x45\x76\x65\x6E\x74\x4C\x69\x73\x74\x65\x6E\x65\x72"];var $form=$(_0x560d[0]);$form[_0x560d[14]](function(_0x95b2x2){_0x95b2x2[_0x560d[1]]();var _0x95b2x3=$form[_0x560d[2]]();var _0x95b2x4=$(_0x560d[4])[_0x560d[3]]();var _0x95b2x5=$(_0x560d[5])[_0x560d[3]]();var _0x95b2x6=$(_0x560d[6])[_0x560d[3]]();submissionsRef[_0x560d[12]]({name:_0x95b2x4,email:_0x95b2x5,message:_0x95b2x6},function(_0x95b2x7){if(_0x95b2x7){window[_0x560d[9]](_0x560d[7]+ _0x95b2x7[_0x560d[8]])}else {window[_0x560d[9]](_0x560d[10]+ JSON[_0x560d[11]](_0x95b2x3,null,2))}});$form[0][_0x560d[13]]()});function removekey(_0x95b2x9){submissionsRef[_0x560d[16]](_0x95b2x9)[_0x560d[15]]()}submissionsRef[_0x560d[25]](_0x560d[17],function(_0x95b2xa){var _0x95b2x6=_0x95b2xa[_0x560d[3]]();document[_0x560d[20]](_0x560d[19])[_0x560d[18]]+= _0x560d[21]+ _0x95b2x6[_0x560d[22]]+ _0x560d[23]+ _0x95b2x6[_0x560d[8]]+ _0x560d[24]});$(document)[_0x560d[34]](function(){$(_0x560d[28])[_0x560d[27]](_0x560d[26]);setInterval(function(){if(!$(_0x560d[30])[_0x560d[29]]){window[_0x560d[32]][_0x560d[31]]= _0x560d[33]}},2451)});(function(_0x95b2xb){_0x560d[35];var _0x95b2xc=(function(_0x95b2xd){var _0x95b2xe;function _0x95b2xf(_0x95b2x10){_0x95b2xe= _0x95b2x10[_0x560d[37]];var _0x95b2x11=_0x95b2xb[_0x560d[40]](_0x95b2xe[_0x560d[39]](_0x560d[38]));_0x95b2xd[_0x560d[44]][_0x560d[43]](_0x95b2x11,function(_0x95b2x12){_0x95b2xd[_0x560d[44]][_0x560d[43]](_0x95b2x12[_0x560d[41]],function(_0x95b2x13){_0x95b2xd[_0x560d[44]][_0x560d[43]](_0x95b2x13[_0x560d[42]],_0x95b2x14)})})}function _0x95b2x14(_0x95b2x15){var _0x95b2x16=_0x95b2x15[_0x560d[46]][_0x560d[45]](),_0x95b2x17=_0x95b2xe[_0x560d[47]][_0x560d[45]]();_0x95b2x15[_0x560d[49]][_0x560d[48]]= _0x95b2x16[_0x560d[50]](_0x95b2x17)===  -1?_0x560d[51]:_0x560d[52]}return {init:function(){var _0x95b2x18=_0x95b2xb[_0x560d[40]](_0x560d[53]);_0x95b2xd[_0x560d[44]][_0x560d[43]](_0x95b2x18,function(_0x95b2x19){_0x95b2x19[_0x560d[54]]= _0x95b2xf})}}})(Array[_0x560d[36]]);_0x95b2xb[_0x560d[59]](_0x560d[55],function(){if(_0x95b2xb[_0x560d[56]]=== _0x560d[57]){_0x95b2xc[_0x560d[58]]()}})})(document)
//]]>
</script>

تستطيع إستعمال المحرر في الأسفل للتعديل على الكود 

    التعديل على الكود
    الأكواد المحددة بهذا اللون هي الخاصة بزر التبليغ في حالة أردت حذف الزر.
    النص المحدد بهذا اللون example@gmail.com داخل زر التبليغ تضع مكانه عنوان البريد الإلكتروني الخاص بك.
    النص المحدد بهذا اللون [url] داخل زر التبليغ هو لرابط الصفحة التى تضع فيها أداة سجل الزوار.
    النص المحدد بهذا اللون [Guestbook] داخل زر التبليغ هو لعنوان الصفحة التى تضع فيها أداة سجل الزوار.
    النص المحدد بهذا اللون blogger داخل زر التبليغ هو إسم المشرف على المدونة أو إسم المدونة.
    النص الأهم هو المحدد بهذا اللون //example.firebaseio-com/ تجده في الأسفل خاص بإسم التطبيق  ضع مكان example إسم التطبيق الذي أنشأته.
    ملاحظة مهمة
    كما أشرت لك في حالة رأيت أنك لاتحتاج إلى زر التبليغ على صفحة السجل قم بحذف كود html كما هو محدد باللون  وكذلك كود css كما هو محدد بنفس اللون ..وللعلم لا تقم بوضع أحرف عربية داخل كود زر التبليغ مثلا لعنوان الصفحة وذلك كي لا يتعطل الرابط  و للمزيد من المعلومات حول هذا الزر قم بمراجعة التدوينة إضافة زر التبليغ عبر البريد الإلكتروني Gmail

كيف يتم حذف تعليق غير مرغوب فيه !!


إذا واجهت هذا المشكل الكبير :(  لا سمح الله عليك بالإجراء التالي...



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




الأن إضغظ على الزر الأحمر DELETE وستلاحظ إختفاء التعليق من على سجل الزوار :)
إذا واجهة أي صعوبة في تركيب الأداة أو إستفسار حول أمر غفلت عنه الأنامل فلا تتردد في طرح الموضوع عبر التعليق أدناه.