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

إضافة سكربت مولد أكواد ألوان التدرج العشوائية في بلوجر جديد 2022

سوف أقدم لكم طريقة إضافة سكربت مولد أكواد ألوان التدرج العشوائية في بلوجر بطريقة جميلة وجديدة نوعاً ما. هذا السكربت مصمم بواسطة أكواد
إضافة سكربت مولد أكواد ألوان التدرج العشوائية في بلوجر جديد 2022
مرحبا بكم في موقع قوالب لونا، في هذا الموضوع، سوف أقدم لكم طريقة إضافة سكربت مولد أكواد ألوان التدرج العشوائية في بلوجر بطريقة جميلة وجديدة نوعاً ما. هذا السكربت مصمم بواسطة أكواد HTML, CSS, JS يمكنك من خلال هذا السكربت إنشاء ألوان عشوائية بنقرة زر واحدة فقط. كما يمكنك رؤية الكود للون الذي قمت باختياره. وأيضاً يوجد زر النسخ الذي يسهل عليك نسخ الكود واستخدامه في عملك. 

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

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

مميزات السكربت

  1. صندوق معاينة ألون، تستطيع من خلاله معاينة اي لون ترغب به. 
  2. صندوق يحتوي على كود الون الذي قمت باختياره. 
  3. زر انشاء المزيد من الألوان. 
  4. زر نسخ الكود، حتى يسهل عليك عملية النسخ بشكل مباشر. 

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

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

<div id="lunacolor"></div>
<input type="text" id="lunacode" readonly>
<div class="lunabtn-con">
<button id="generate-btn">إنشاء</button>
<button id="copy-btn">نسخ </button>
</div>

<style>
#lunacolor{width:100%;height:35vmin;border-radius:5px}
#lunacode{background-color:#f1f5fc;font-size:2.7vmin;text-align:center;font-weight:500;color:#044db4;width:100%;height:50px;border-radius:5px;border:1px solid #cfd5d5;margin:20px 0 40px 0}
.lunabtn-con{display:flex;justify-content:space-around}
.lunabtn-con button{background:#185ee0;min-width:42%;padding:12px 0;color:#ffffff;border-radius:7px;font-size:3vmin;border:0;margin-bottom:8px;font-weight:500;cursor:pointer}
</style>


<script>/*<![CDATA[*/
let generateBtn=document.getElementById("generate-btn");let copyBtn=document.getElementById("copy-btn");let outputColor=document.getElementById("lunacolor");let outputCode=document.getElementById("lunacode");let hexString="0123456789abcdef";let randomColor=()=>{let hexCode="#";for(i=0;i<6;i++){hexCode+=hexString[Math.floor(Math.random()*hexString.length)];}
return hexCode;}
let generateGrad=()=>{let colorOne=randomColor();let colorTwo=randomColor();let angle=Math.floor(Math.random()*360);outputColor.style.background=`linear-gradient(${angle}deg,${colorOne},${colorTwo})`;outputCode.value=`background:linear-gradient(${angle}deg,${colorOne},${colorTwo});`;}
copyBtn.addEventListener("click",()=>{outputCode.select();document.execCommand("copy");});generateBtn.addEventListener("click",generateGrad);window.onload=generateGrad;
/*]]>*/</script>

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

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

إرسال تعليق

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