طريقة اضافة اشترك في القائمة البريدية على البلوجر باحترافية

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

طريقة اضافة اشترك في القائمة البريدية على البلوجر باحترافية

1. نتوجه الى البلوجر  ثم الى قالب 

2. تحرير HTML 

3. ابحث عن الكود الثالي   (استعمل CTRL+F)

</head>

4. ضع الكود الثالي من فوق الكود السابق 

<style>
      /* Start Follow by Email Widget By HTTP://www.hukmaty.info/ */
      .follow-by-email-inner td {
        width: 100%;
      }
      .FollowByEmail .follow-by-email-inner {
        margin-top:10px;
      }
      .FollowByEmail .follow-by-email-inner .follow-by-email-address {
        height: 40px;
        border: 0 !important;
        background-color: #e6e6e6;
        text-align: center;
        font-family: DroidKufi-regular;
        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        color: #000000;
      }
      .follow-by-email-submit {
        background-color: #32aef1 !important;
        width: 100% !important;
        margin: 0 !important;
        height: 40px !important;
        min-width: 80px !important;
        font-family: DroidKufi-regular !important;
        font-style: normal !important;
        font-weight: 400 !important;
        font-size: 12px !important;
        margin-top: 5px !important;
        color: #ffffff !important;
      }
      .follow-by-email-address:focus {
        outline: 0;
      }
      .FollowByEmail .widget-content:before {
        content: "هنا تستطيع الأشتراك في قائمتنا البريدية ضع إيملك بالأسفل وأضغط أشتراك ولا تنسي تأكيد أشتراكك من خلال بريدك الألكتروني";
        font-family:DroidKufi-regular;
        font-style: normal;
        font-weight: 400;
        font-size: 11px;
      }
      .email-icon {
        position: absolute;
        top: 12px;
        color: #32aef1;
      }
      .follow-by-email-inner td {
        float: left;
      }
      .email-icon {
        left: 15px;
      }
</style>

5. ابحث مجددا عن الكود الثالي 

</body>

6. ثم ضع هذا الكود من فوقه 

<script type='text/javascript'>
      //<![CDATA[
      // template Jquery Codes
      $( ".FollowByEmail .follow-by-email-inner form table" ).html( "<tr><td><input class='follow-by-email-address' name='email' placeholder='البريد الألكتروني..' type='text'><div class='email-icon'><i class='fa fa-envelope'/></div></td><td width='64px'><input class='follow-by-email-submit' type='submit' value='أشتراك'></td></tr>" ); $( "#sidebar-wrapper .widget h2" ).wrap( "<div class='widget-title'/>" );$('.error_page #main-wrapper').prepend('<div class="error-title"><span>404</span>');
      //]]>
</script>

7. مبروك .

مقالات ذات صلة