كيفية عمل الكتابة التلقائية لمدونات بلوجر بأحترافية

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

شرح التركيب

1. أولا سوف تقوم بوضع الكود التالى فى مدونتك فوق الوسم التالى</body>

<script> $(function(){$(&quot;.element&quot;).typed({ strings: [&quot;مرحبا بكم متابعى مدونة عالم المدون&quot;, &quot;أتمنى أن تجد ما تبحث عنه على المدونة&quot;, &quot;عالم المدون يوفر لك كل ما يخص بلوجر&quot;, &quot;من قوالب وإضافات وشروحات وكل شئ&quot;, &quot;بالتوفيق للجميع فى ما يبحثو عنة&quot;],typeSpeed:50,loop: true,});}); /*<![CDATA[*/ ! function(b){var a = function(d,c){this.el = b(d);this.options = b.extend({} ,b.fn.typed.defaults,c);this.isInput = this.el.is("input");this.attr = this.options.attr;this.showCursor = this.isInput ? false:this.options.showCursor;this.elContent = this.attr ? this.el.attr(this.attr):this.el.text();this.contentType = this.options.contentType;this.typeSpeed = this.options.typeSpeed;this.startDelay = this.options.startDelay;this.backSpeed = this.options.backSpeed;this.backDelay = this.options.backDelay;this.strings = this.options.strings;this.strPos = 0;this.arrayPos = 0;this.stopNum = 0;this.loop = this.options.loop;this.loopCount = this.options.loopCount;this.curLoop = 0;this.stop = false;this.cursorChar = this.options.cursorChar;this.shuffle = this.options.shuffle;this.sequence = [];this.build()} ;a.prototype ={constructor:a,init:function(){var c = this;c.timeout = setTimeout(function(){for (var d = 0;d < c.strings.length;++d){c.sequence[d] = d} if (c.shuffle){c.sequence = c.shuffleArray(c.sequence)} c.typewrite(c.strings[c.sequence[c.arrayPos]],c.strPos)} ,c.startDelay)} ,build:function(){if (this.showCursor === true){this.cursor = b('<span class="typed-cursor">' + this.cursorChar + "</span>");this.el.after(this.cursor)} this.init()} ,typewrite:function(d,e){if (this.stop === true){return} var f = Math.round(Math.random() * (100 - 30)) + this.typeSpeed;var c = this;c.timeout = setTimeout(function(){var i = 0;var l = d.substr(e);if (l.charAt(0) === "^"){var k = 1;if (/^\^\d+/.test(l)){l = /\d+/.exec(l)[0];k += l.length;i = parseInt(l)} d = d.substring(0,e) + d.substring(e + k)} if (c.contentType === "html"){var h = d.substr(e).charAt(0);if (h === "<" || h === "&"){var g = "";var j = "";if (h === "<"){j = ">"} else{j = ";"} while (d.substr(e).charAt(0) !== j){g += d.substr(e).charAt(0);e++} e++;g += j}} c.timeout = setTimeout(function(){if (e === d.length){c.options.onStringTyped(c.arrayPos);if (c.arrayPos === c.strings.length - 1){c.options.callback();c.curLoop++;if (c.loop === false || c.curLoop === c.loopCount){return}} c.timeout = setTimeout(function(){c.backspace(d,e)} ,c.backDelay)} else{if (e === 0){c.options.preStringTyped(c.arrayPos)} var m = d.substr(0,e + 1);if (c.attr){c.el.attr(c.attr,m)} else{if (c.isInput){c.el.val(m)} else{if (c.contentType === "html"){c.el.html(m)} else{c.el.text(m)}}} e++;c.typewrite(d,e)}} ,i)} ,f)} ,backspace:function(d,e){if (this.stop === true){return} var f = Math.round(Math.random() * (100 - 30)) + this.backSpeed;var c = this;c.timeout = setTimeout(function(){if (c.contentType === "html"){if (d.substr(e).charAt(0) === ">"){var g = "";while (d.substr(e).charAt(0) !== "<"){g -= d.substr(e).charAt(0);e--} e--;g += "<"}} var h = d.substr(0,e);if (c.attr){c.el.attr(c.attr,h)} else{if (c.isInput){c.el.val(h)} else{if (c.contentType === "html"){c.el.html(h)} else{c.el.text(h)}}} if (e > c.stopNum){e--;c.backspace(d,e)} else{if (e <= c.stopNum){c.arrayPos++;if (c.arrayPos === c.strings.length){c.arrayPos = 0;if (c.shuffle){c.sequence = c.shuffleArray(c.sequence)} c.init()} else{c.typewrite(c.strings[c.sequence[c.arrayPos]],e)}}}} ,f)} ,shuffleArray:function(f){var c,e,d = f.length;if (d){while (--d){e = Math.floor(Math.random() * (d + 1));c = f[e];f[e] = f[d];f[d] = c}} return f} ,reset:function(){var c = this;clearInterval(c.timeout);var d = this.el.attr("id");this.el.after('<span id="' + d + '"/>');this.el.remove();if (typeof this.cursor !== "undefined"){this.cursor.remove()} c.options.resetCallback()}} ;b.fn.typed = function(c){return this.each(function(){var f = b(this),e = f.data("typed"),d = typeof c == "object" && c;if (!e){f.data("typed",(e = new a(this,d)))} if (typeof c == "string"){e[c]()}} )} ;b.fn.typed.defaults ={strings:["These are the default values...","You know what you should do?","Use your own!","Have a great day!"],typeSpeed:0,startDelay:0,backSpeed:0,shuffle:false,backDelay:500,loop:false,loopCount:false,showCursor:true,cursorChar:"|",attr:null,contentType:"html",callback:function(){} ,preStringTyped:function(){} ,onStringTyped:function(){} ,resetCallback:function(){}}} (window.jQuery); /*]]>*/ </script>

1. سوف تقوم بتعديل ما فى الكتابة بما تريدها فى هذا الكود
2. الأن الكود الثانى وسوف تضعه فوق الوسم التالى]]></b:skin>فى مدونتك

#about{background-color:#fff;padding-top:50px;padding-bottom:50px;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3iym7gX2gNyuUqOBNaQuz4Uft8yvdS9xmtVYcbpGE9Z5tE4SaAKTj-LateQ5a7GfTtYoQcy3RjtMtK4vO7dkeTS2aVS1XFkwFK_zU_0D08COhcMa7fvw9KUBUqmOup4DudSdAtBdSSTxB/s1600/wdbloog.png)!important;background-position:center center!important;background-repeat:no-repeat!important;background-size:cover!important;transition:opacity .5s ease 0;overflow:hidden;margin-bottom: 15px;}
.vc_column-inner{padding-top:35px;text-align:center}
#countdown-timer{font-weight:700;margin:0 -30px;display:inline-block}
#countdown-timer >.countdown-section{display:block;float:left;font-size:62px;line-height:1;color:#fff;margin:0 30px}
.countdown-section i{background-color: #FFFFFF;font-size:40px;color:#5A67A6;border-radius:50%;width:80px;height:80px;line-height:80px;margin-bottom:10px;padding-left:3px}
#countdown-timer >.countdown-section >.countdown-period{display:block;font-size:22px;margin-top:8px;line-height:1;text-transform:uppercase;letter-spacing:1px;color:#fff;font-weight:500}
.type-wrap{color:#FFF;font-size:63px;line-height:124px;font-weight:900;min-height:119px}
.element{direction:rtl;display:inline-block}
.typed-cursor{opacity:1;color:#7B88CC;font-weight:100;-webkit-animation:blink 0.7s infinite;-moz-animation:blink 0.7s infinite;-ms-animation:blink 0.7s infinite;-o-animation:blink 0.7s infinite;animation:blink 0.7s infinite}
.item #about,.error_page #about,.static_page #about{display:none}

1. الأن مع اخر كود وسوف تضعه فى المكان الذى تريده

<h2 class='type-wrap'>
<div class='element'/>
</h2>

1. وبعد ذلك تفوم بحفظ القالب ومبروك عليك الأضافة 

وهكذا كان موضوع اليوم بالتوفيق للجميع فى أمان الله 

المصدر عالم المدون