صورة للمعاينة :
- توجه إلى لوحة تحكم بلوجر
- ثم على تبويب المظهر ثم تعديل HTML
- ابحث عن هذه الوسم <head> وتقوم بلصق الكود التالي اسفله مباشر
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
4 - ابحث عن هذه الوسم </head> وتقوم بلصق الكود التالي فوقه مباشر
<style>div#pelajar {position: fixed;top: 0;left: 0;right: 0;bottom: 0;z-index: -99;opacity: 0;transition:.5s;background: rgba(0,0,0,0.5);}div#pelajar.active{z-index: 9999;opacity: 1;}div#whatsapp {position: fixed;top: 50%;left: 50%;max-width: 480px;width: 95%;background: #fff;transform: translate(-50%,-50%);z-index: -1;opacity: 0;border-radius: 5px;overflow: hidden;box-shadow: 0 2px 5px rgba(0,0,0,0.5);transition:.5s;}div#whatsapp.active {z-index: 999999;opacity: 1;}p.wa-title {margin: 0;padding: 15px;font-size: 16px;text-align: center;font-weight: bold;background: #2ecc71;color: #fff;}.wa-body {padding: 14px;display: flex;flex-wrap: wrap;width: 100%;box-sizing: border-box;}.wa-input {border: 1px solid #ddd;border-radius: 3px;line-height: 32px;padding: 0 10px;box-shadow: inset 0 0 2px rgba(0,0,0,0.1);}.wa-input.bagi {width: 48%;margin: 1%;margin-bottom: 10px;}.wa-input.full {width: 98%;resize: none;min-height: 150px;margin: 0 1%;}a.submit {line-height: 24px;padding: 10px 15px;width: 100%;max-width: 200px;text-align: center;background: #2ecc71;margin: 14px auto 0 auto;display: block;color: #fff;border-radius: 3px;cursor: pointer;}span.wa-x {position: absolute;top: 5px;right: 5px;height: 30px;width: 30px;/* background: #222; */border: 2px solid #fff;border-radius: 50px;corsor:pointer;}a#wa-icon {position: fixed;bottom: 30px;left: 30px;line-height: 0;border-radius: 30px;background: #2ecc71;padding: 0;height: 60px;width: 60px;color: #fff;box-shadow: 0 10px 20px rgba(0,0,0,0.1);/* filter: invert(100%); */z-index:99;}a#wa-icon::before {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}span.wa-x::before {content: "";position: absolute;top: 50%;left: 50%;height: 3px;width: 50%;background: #fff;transform: translate(-50%,-50%);}@media (max-width: 480px){.wa-input.bagi {width: 100%;margin: 0;margin-bottom: 10px;}a#wa-icon {bottom:10px;left:10px;}.wa-input.full {width: 100%;margin: 0;}} </style>
4 - ابحث عن هذه الوسم </head> وتقوم بلصق الكود التالي فوقه مباشر
5 - الخطوة الآخرة، ابحث عن هذه الوسم </body> وتقوم بلصق الكود التالي فوقه مباشر
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'/><a class='fa fa-whatsapp fa-3x animated infinite rubberBand' href='javascript:void(0);' id='wa-icon' onclick='openModal()'></a><div class='pelajar' id='pelajar'></div><div id='whatsapp'><span class='wa-x' onclick='closeModal()'></span><p class='wa-title'>أرسال رسالة الي مدير الموقع عبر واتسآب</p><div class='wa-body'><input class='tujuan' type='hidden' value='06666666'/><!-- No. WhatsApp --><input class='nama wa-input bagi' placeholder='رقم الهاتف' type='text'/><input class='email wa-input bagi' placeholder='البريد الالكتروني' type='email'/><textarea class='pesan wa-input full' placeholder='الرسالة'></textarea><a class='submit'>أرسال</a></div></div><script type='text/javascript'>function closeModal() {document.getElementById('pelajar').classList.remove('active')document.getElementById('whatsapp').classList.remove('active')}function openModal() {document.getElementById('pelajar').classList.add('active')document.getElementById('whatsapp').classList.add('active')}// Onclick Whatsapp Sent!$('#whatsapp .submit').click(WhatsApp);var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;function WhatsApp() { var ph = ''; if ($('#whatsapp .nama').val() == '') { // Cek Nama ph = $('#whatsapp .nama').attr('placeholder'); alert('يرجى ادخال ' + ph); $('#whatsapp .nama').focus(); return false; } else if ($('#whatsapp .email').val() == '') { // Cek Email ph = $('#whatsapp .email').attr('placeholder'); alert('يرجى ادخال ' + ph); $('#whatsapp .email').focus(); return false; } else if (reg.test($('#whatsapp .email').val()) == false) { // Cek Validasi Email alert('عنوان البريد الإلكتروني غير صالح.'); $('#whatsapp .email').focus(); return false; } else if ($('#whatsapp .pesan').val() == '') { // Cek Pesan ph = $('#whatsapp .pesan').attr('placeholder'); alert('يرجى ادخال ' + ph); $('#whatsapp .pesan').focus(); return false; } else { if (!confirm("هل قمت بتثبيت واتسآب")) { window.open("https://www.whatsapp.com/download/"); } else { // Check Device (Mobile/Desktop) var url_wa = 'https://web.whatsapp.com/send'; if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) { url_wa = 'whatsapp://send/'; } // Get Value var tujuan = $('#whatsapp .tujuan').val(), via_url = location.href, nama = $('#whatsapp .nama').val(), email = $('#whatsapp .email').val(), pesan = $('#whatsapp .pesan').val(); var w = 960, h = 540, left = Number((screen.width / 2) - (w / 2)), tops = Number((screen.height / 2) - (h / 2)), popupWindow = window.open(this.href, '', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=1, copyhistory=no, width=' + w + ', height=' + h + ', top=' + tops + ', left=' + left); popupWindow.focus(); return false; } }}</script>
هذا كل شئ فى موضوع اليوم بالتوفيق للجميع وأنتظرونا بكل جديد بأذن الله على المدونة، لا تنس مشاركة الموضوع حتى يتسفيد غيرك وأى مشكلة تجدها تضعها فى تعليق