يرجى متابعة الموقع للحصول على كل ما هو جديد وحصري . متابعة

إضافة سكربت عداد الكلمات والحروف داخل الصفحات الثابتة في مدونة بلوجر

كيفية إنشاء عداد الكلمات والحروف في بلوجر على الصفحات الثابتة بشكل بسيط وأنيق، هذا السكربت مصمم بواسطة أكواد CSS, HTML وبمساعدة JavaScript.
إضافة سكربت عداد الكلمات والاحرف داخل الصفحات الثابتة في مدونة بلوجر
مرحبا بكم في موقع قوالب لونا، لقد شرحت سابقا طريقة تثبيت سكربت عداد الكلمات على منصة بلوجر | word counter script for blogger، لكن هذا السكربت على شكل قالب بلوجر وليس إضافة داخل الصفحات الثابتة. لذلك سوف يكون موضوع اليوم عن كيفية إنشاء عداد الكلمات والحروف في بلوجر على الصفحات الثابتة بشكل بسيط وأنيق، هذا السكربت مصمم بواسطة أكواد CSS, HTML وبمساعدة JavaScript

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

طريقة عمل السكربت

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

معاينة السكربت على بلوجر

معاينة

إضافة السكربت في بلوجر 

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

<br/>
<style>
.lunaword{margin:0 auto;max-width:28.625rem;width:100%}
.lunaword textarea{border:2px solid #185ee0;border-radius:3px;display:block;font-size:1rem;margin:0 0 0.694em;padding:0.781rem;width:100%;height:200px}
.lunaword .label{margin:0 0 1.44rem;width:50%}
.lunaword .label.left{float:left}
.lunaword .label.right{float:right;text-align:center}
.lunaword .lunacount{color:#fff;text-align:center;padding:10px;width:150px;border-radius:3px;background:#185ee0;font-size:19px}
</style>

<form class="lunaword">
<textarea id="count-luna" data-count-limit="140" rows="3" placeholder="اكتب النص هنا"></textarea>
<p id="countlabel" class="label right lunacount"><span id="countnumber">0</span> حرف </p>
<form>


<script>
(function(){var c=document.getElementById("count-luna");var a=document.getElementById("countlabel");var d=document.getElementById("countnumber");function b(g){var f=Number(this.getAttribute("data-count-limit"));var h=this.value;d.textContent=h.length}c.addEventListener("keyup",b,false)}());
</script>
  


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

شكرا لزيارة موقعنا. إذا كانت لديك أي أسئلة، يرجى وضعها في التعليقات، وسأرد في أقرب وقت ممكن.

إرسال تعليق

إمتداد ويب © 2021 - 2022