اعلان وحد

اقدم لكم هذا الشرح المفصل لطريقة اضافة اعلانات ادسنس او اي اعلانات داخل الموضوع في مدونات بلوجر
لمتابعة آخر اخبار ادسنس انضم الى مجموعتنا - ادسنس العرب


ملاحظه :

كنت قد شرحت في موضوع سابق تركيب اعلان ادسنس يمين او يسار الصفحه او في منتصف الصفحة بحيث يظهر بشكل منزلق امام الزائر ، اضغط هنا لقراءة الموضوع  .

اولا : اضافة اعلانات ادسنس في مقدمة او نهاية الموضوع
في البداية يجب عليك انشاء وحدة اعلانية بأي قياس تريد ثم الحصول على شفرة الأعلان ، ثم قم بتحويل الشفره  من هنا ثم انسخ الكود المحول وضعه في المكان المخصص في الكود التالي  :














<div align='center'><br />
<b:if cond='data:blog.pageType == "item"'><br />
كود ادسنس المحول هنا<br />
</b:if><br />
</div><br />


الآن انسخ الكود كاملا واحتفظ به في ملف تكست .



بعد ذلك توجه الى لوحة تحكم بلوجر ثم اختار قالب ثم اختار تحرير html وابحث عن هذا الكود <data:post.body/> باستخدام CTRL+F ، ستجد اكثر من كود ، الكود المطلوب هو عادة يكون الكود الثاني او الكود الذي يلي جملة اقرأ المزيد



ثم انسخ كود اعلان ادسنس الذي احتفظنا به في ملف التكست وضعه قبل <data:post.body/> اذا اردت ظهور الأعلان في مقدمة الموضوع  ، واذا اردت ظهور الأعلان نهاية الموضوع فضع كود اعلان ادسنس بعد <data:post.body/>



ثانيا : اضافة اعلان ادسنس وسط الموضوع
ابحث عن هذا الكود <data:post.body/>  في html  كما ذكرنا في الخطوة الأولى والذي يأتي بعد رابط اقرأ المزيد ثم احذفه وضع مكانه الكود التالي :











 كود الأعلان في الخلفيه يمين ويسار الصفحه دون أن يغطي على محتوى الموضوع وغير مخالف لسياسات أدسنس في وضع الأعلانات
شاهد مثال على الأعلان اضغط على الصوره








طريقة التركيب
توجه الى لوحة تحكم بلوجر ثم تخطيط وضع الكود في اي مكان باضافة اداه

كود الأعلان يمين الصفحه











<center><br />
<div style="position: fixed; top:0; margin-right:-675px; /*background: url(templates/mt/images/vert_ads.png) no-repeat;*/ width:160px; height:100%; right:50%; "><br />
الاعلان  هنا<br />
</div><br />
</center><br />


كود الأعلان يسار الصفحه









<center><br />
<br />
<div style="position: fixed; top:0; margin-left:-675px; /*background:url(templates/mt/images/vert_ads.png) no-repeat;*/ width:160px; height:100%; left:50%; "><br />
<br />
الاعلان هنا<br />
</div><br />
</center><br />


كود الأعلان يمين ويسار الصفحه







<center><br />
<div style="position: fixed; top:0; margin-right:-675px; /*background: url(templates/mt/images/vert_ads.png) no-repeat;*/ width:160px; height:100%; right:50%; "><br />
الاعلان الاول هنا<br />
</div><br />
<div style="position: fixed; top:0; margin-left:-675px; /*background:url(templates/mt/images/vert_ads.png) no-repeat;*/ width:160px; height:100%; left:50%; "><br />
<br />
الاعلان الثاني هنا<br />
<br />
</div><br />
</center><br />


ملاحظة :يمكنك التحكم في الرقم 675 الموجود في الكود اما بالزيادة او النقصان وذلك حسب عرض قالب مدونتك















اضف وحدة اعلانية بعد فاصل اقرأ المزيد







Put Ads  After Read More

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














كما ترى المساحة الإعلانية تظهر فوق ولتركيب الكود كل ما عليك اتباع التالي

أولا فوق الوسم </head> أضف الكود التالي

<script type='text/javascript'>



$(document).ready(function(){







$(&#39;a[name=&quot;more&quot;]&#39;).before($(&#39;#cnmu-more-ads&#39;).html());



$(&#39;#cnmu-more-ads&#39;).html(&#39;&#39;);







});



</script>

ثم ابحث عن هذا الكود <data:post.body/>

وبعده اضف التالي

 <b:if cond='data:blog.pageType == &quot;item&quot;'>



<div style="display:none;">



<div id='cnmu-more-ads'>



<br/>



<center>



اضف كود الإعلان هنا












</center>



<br/>



</div>



</div>



</b:if>

ملاحظة ربما يكون الكود متكرر اكثر من مرة فيجب ان تجرب حتى تصل للكود المطلوب

وطبعا استبدل  اضف كود الإعلان هنا بكود الإعلان كما ذكرت ادسنس حسوب او غيرهما لكن طبعا لا تنسى تحويله بمحول الأكواد

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

هذا هو الكود اضفه فوق الوسم</head>

 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>







لا يستخدم الشريط الجانبي في مشاركات المدونة فقط للأدوات التي تدعم محتوى المدونة ، ولكنه يستخدم أيضًا فى الوحدات الإعلانية الذاتية ، التي تعرض بانر تصميم إعلان 300 × 250 أو 125 × 125 ، يمكنك أيضًا استخدام اعلانات أدسنس به مثل ما فى مدونة عالم المدون حاليا أو إعلانات بانر بديلة أخرى في الشريط الجانبي.







عندما تقوم بإضافة إعلانات البانرات 300 × 250 و 125 × 125 إلى الشريط الجانبي ، يجب أن تظهر إعلانات البانرات ، أو بمعنى اخر يجب أن تكون بتنسق جيد لها ، وفى هذا الموضوع سوف أقدم لكم إضافة لوضع إعلانات البانرات فى الشريط الجانبي بطريقة احترافيه بأستخدام CSS و HTML .







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

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





معاينة الإضافة




معاينة







صورة من الإضافة














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




تابع معى الشرح والخطوات التاليه لمعرفة كيفية وضع بسيطة بأحجام 300 × 250 أو 125 × 125 فى الشريط الجانبي بكل سهوله.







اولا قم بوضع الكود التالى فوق الوسم]]></b:skin>هذا فى مدونتك.





*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
.banner_box_ads{background:#efefef;width:300px;margin:0 auto;text-align:center;padding:16.6666666667px}
.banner_box{background:#ddd;height:125px;width:125px;display:inline;margin:0;padding:0;float:right;position:relative;}
.banner_box:nth-child(1),.banner_box:nth-child(3){margin-left:16.6666666667px}
.banner_box:nth-child(1),.banner_box:nth-child(2){margin-bottom:16.6666666667px}
.banner_box a{position:relative;display:block;z-index:2}
.banner_box img{object-fit:cover}
.banner_box:before{content:"125x125";line-height:1.2;position:absolute;top:0;left:0;width:100%;height:100%;color:#444;font-size:20px;display:flex;flex-direction:column;justify-content:center;z-index:1;}
.banner_300{width:300px;height:250px;}
.banner_box.banner_box-300:nth-child(1){margin-right:0;margin-bottom:0;}
.banner_box_ads.box_widget{padding:0;}
.banner_300:before{content:"300x250";}
.clear{clear:both;}




الأن عليك حفظ القالب وتقوم بالأنتقال الى التخطيط فى مدونتك الأن وتقوم بأنشاء أداة جديد وتقوم بوضع الكود التالى بها.







<div class="banner_box_ads box_widget">
<div class="banner_box banner_300">
<!-- 300x250 -->
<a href="رابط الأعلان" target="_blank" rel="nofollow noopener" title="نص الإعلان">
<img src="رابط الصورة" alt="نص الإعلان" title="نص الإعلان" height="250" width="300"/></a>
</div>
<div class="clear"/>
</div>
<div class="banner_box_ads">
<div class="banner_box">
<!-- 125x125 -->
<a href="رابط الأعلان" target="_blank" rel="nofollow noopener" title="نص الإعلان">
<img src="رابط الصورة" alt="نص الإعلان" title="نص الإعلان" height="125" width="125"/></a>
</div>
<div class="banner_box">
<!-- 125x125 -->
<a href="رابط الأعلان" target="_blank" rel="nofollow noopener" title="نص الإعلان">
<img src="رابط الصورة" alt="نص الإعلان" title="نص الإعلان" height="125" width="125"/></a>
</div>
<div class="banner_box">
<!-- 125x125 -->
<a href="رابط الأعلان" target="_blank" rel="nofollow noopener" title="نص الإعلان">
<img src="رابط الصورة" alt="نص الإعلان" title="نص الإعلان" height="125" width="125"/></a>
</div>
<div class="banner_box">
<!-- 125x125 -->
<a href="رابط الأعلان" target="_blank" rel="nofollow noopener" title="نص الإعلان">
<img src="رابط الصورة" alt="نص الإعلان" title="نص الإعلان" height="125" width="125"/></a>
</div>
<div class="clear"/>
</div>




الأن سوف يكون عليك كل ما فى الكود من عبارات بما يناسب الأعلان الخاص بك وبعد ذلك سوف تقوم بحفظ الإضافة.







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

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







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







اضافة وحدة اعلانية منزلقة تظهر على الهاتف لمدونات بلوجر

اضافة وحدة اعلانية منزلقة تظهر على الهاتف لمدونات بلوجر





معاينة للإضافة




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







معاينة





صورة من الإضافة




اضافة وحدة اعلانية منزلقة تظهر على الهاتف لمدونات بلوجر

اضافة وحدة اعلانية منزلقة تظهر على الهاتف لمدونات بلوجر









اضافة وحدة اعلانية منزلقة تظهر على الهاتف لمدونات بلوجر




التركيب للأضافة والأكواد سهل جدا سوف يكون عليك أولا أن تبحث عن هذا الوسم</head>وتقوم بوضع الكود التالى فوقه ، وفى بعض القوالب سوف تجد الوسم بهذا الشكل&lt;/head&gt;&lt;!--<head/>--&gt;ضع الكود التالى فوقه ايضا.







<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;,} and not data:blog.searchQuery and data:blog.isMobileRequest == &quot;true&quot;'>
<style>
/*<![CDATA[*/
.sticky-ads{display:-ms-flexbox;display:-webkit-box;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:fixed;overflow:visible;text-align:center;bottom:-104px;left:0;width:100%;z-index:9999;height:100px;background-image:none;background-color:#fff;margin-bottom:0;padding-top:4px;box-shadow:0 0 5px 0 rgba(0,0,0,0.2);transition:all .4s ease-in-out}
.sticky-ads-close{position:absolute;width:28px;height:28px;top:-28px;right:0;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMTMnIGhlaWdodD0nMTMnIHZpZXdCb3g9JzM0MSA4IDEzIDEzJyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJz48Zz48cGF0aCBzdHlsZT0nZmlsbDojNEY0RjRGJyBkPSdNMzU0IDkuMzFMMzUyLjY5IDhsLTUuMTkgNS4xOUwzNDIuMzEgOCAzNDEgOS4zMWw1LjE5IDUuMTktNS4xOSA1LjE5IDEuMzEgMS4zMSA1LjE5LTUuMTkgNS4xOSA1LjE5IDEuMzEtMS4zMS01LjE5LTUuMTl6Jz48L3BhdGg+PC9nPjwvc3ZnPg==");background-size:13px 13px;background-position:9px;background-color:#fff;background-repeat:no-repeat;box-shadow:0 -1px 1px 0 rgba(0,0,0,0.2);border:none;border-radius:12px 0 0 0;cursor:pointer}
.sticky-ads-close:before{position:absolute;content:"";top:-20px;right:0;bottom:0;left:-20px}
*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
:active,:focus{outline:0}
/*]]>*/
</style>
</b:if>




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







<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;,} and not data:blog.searchQuery and data:blog.isMobileRequest == &quot;true&quot;'>
<div class='sticky-ads' id='sticky-ads'>

ضع الاعلان هنا

<button aria-label='Kapat' class='sticky-ads-close' onclick='document.getElementById(&apos;sticky-ads&apos;).style.display=&apos;none&apos;;'/>
</div>
<script>
//<![CDATA[
window.addEventListener("scroll",function(){
  var target = document.getElementById('sticky-ads');
  if(window.pageYOffset > 300){
   target.style.bottom = "0";
  }
},false);
//]]>
</script>
</b:if>




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







ولجعل أعلان أدسنس يظهر بحجم متجاوب على الهاتف سوف تقوم بأنشاء وحده اعلانية  جديده مثلا 300x250 ، بعد ذلك سوف تقوم بتغيير العرض 300 الى 100% الأرتفاع 250 الى 100 وبعد ذلك تقوم بوضع كود الأعلان فى القالب ، او يمكنك أنشاء وحدة اعلانية جديد بهذا الحجم مرة واحده.







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



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













طريقة تركيب اعلانات ادسنس المدمجة مع الخلاصة




توجه الى لوحة تحكم ادسنس واختار اعلاناتي ثم وحدة اعلانية جديدة
اختار الأعلانات داخل الخلاصة كما في اصورة


















بعدها ستنتقل الى الصفحة التاليه والتي من خلالها يوجد خيارين :




 الخيار الاول ( وانا افضل هذا الخيار ) :



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





















الخيار الثاني :



ان تحدد انت بنفسك شكل الاعلان وكيفة ظهوره على مدونتك حسب ما تراه مناسبا لقالبك .







سينقلك ببعدها الى صفحة انشاء شفرة الاعلان ، اختار اسم للأعلان ثم انسخ الشفره وقم بتحويلها من هنا
توجه الى لوحة تحكم بلوجر ثم المظهر ثم تحرير html وباستخدام ctrl + f ابحث عن الكود التالي :


<b:include data='post' name='post'/>
ثم الصق بعده مباشرة الكود التالي وضع شفرة الاعلان المحول في مكانها في الكود ادناه ثم احفظ القالب:







<b:if cond='data:blog.pageType == &quot;index&quot;'>
<b:if cond='data:post.isFirstPost'>
<div class='wdbloog-ad'>

ضع شفرة الأعلان المحول هنا

</div>
</b:if>
</b:if>




انتهى الشرح مزيد من المعلومات انضم الى جروب ادسنس العرب







شرح تركيب اعلانات ادسنس الجديدة Native داخل الخلاصة والمقالة علي مدونة بلوجر







شرح تركيب اعلانات ادسنس الجديدة Native داخل الخلاصة والمقالة علي مدونة بلوجر


نقدم اليوم شرح تركيب اعلانات ادسنس الجديدة Native ads التى ظهرت حديثا لجميع المستخدمين، وهي مجموعة اعلانات باشكال مختلفة واماكن جديدة لتحسين تجربة عرض الاعلانات داخل صفحات موقعك، وظهرت وحدات الاعلانات بنوعين، نوع الوحدة الاعلانية الاول باسم الاعلانات داخل الخلاص، والنوع الثاني الاعلانات داخل المقالة، يمكن استخدام جميع انواع الوحدات الاعلانية في نفس الوقت او انواع منفردة .



مميزات اعلانات Native داخل المقالة وفي الخلاصة
متناسقة بشكل كبير مع صفحات الموقع .
تظهر اعلانات عالية الجودة بعناوين كبيرة .
احجام مختلفة متوافق بشكل تلقائي مع جميع الشاشات علي الموبايل وسطح المكتب .
توفير اماكن واشكال مختلفة تساعد في زيادة ارباح اعلاناتك .
متاحة لجميع الناشرين .
تحسين مباشر من فريق جوجل عند تفعيل ذلك فقط.
إعلانات داخل الخلاصة " Native Ads In-feed "
الإعلانات المدمجة مع المحتوى ضمن الخلاصة هي نوع من الوحدات الجديدة التي تحمل شكل وتنسيق مختلف شبيه بشكل كبير تصميم موقعك، ويضمن فرصة ربح مختلفة عن الطرق الاعتيادية، علي سبيل المثال يمكن اضافة اعلان داخل الخلاصة علي شكل مقال مدمج ضمن مقالات موقعك علي الصفحة الرئيسة وصفحات البحث والاقسام والتاجات، ويمكن اضافة الاعلانات في باداة المقالات او بين المقالات او اخر الصفحة .



إعلانات داخل المقال " Native Ads In-articles "
الإعلانات المدمجة مع المحتوى داخل المقالة هي نوع مختلف عن اعلانات الخلاصة، ويعتبر هذا النوع هو الافضل والاكثر ربح لتواجدا في صفحات المقالات التي لها النصيب الاكبر من زيارات موقعك في اماكن متميزة، حيث يتم عرض وحدة اعلان الخلاصة داخل فقرات المحتوي، ويمكن اضافة اكتر من وحده اعلانية باستخدام اعلان بعد كل فقرة ولكن يجب ان يوجد محتوي كافي علي الصفحة .



طريقة انشاء وحدات ادسنس الجديدة Native
سجّل الدخول إلى حسابك في AdSense.
في لوحة التنقل اليمنى، انقر على إعلاناتي.
انقر على +‎وحدة إعلانية جديدة.
انقر على الإعلانات ضمن المقالة.
أدخل اسمًا لوحدتك الإعلانية للإعلان ضمن المقالة وينصح بتسمية الاعلان بنفس اسم الوحدة.
اعدادات نمط إعلانك ليطابق المحتوى لديك.
انقر على حفظ والحصول على الشفرة.
انسخ شفرة الإعلان ضمن المقالة والصقها على موقعك داخل HTML لصفحتك كما في الشرح التالي.
نقترح بأن تضع الشفرة بعد فقرتين من بداية المقالة.
شرح تركيب اعلان داخل المقال " Native Ads In-articles "
اعلان داخل المقال

ابحث الكود التالي الخاص بعرض المقالة.
<data:post.body/>

قم باستبداله بالكود التالي مع تغير المطلوب ( كود الاعلان - رقم الفقرة التي يظهر الاعلان بعدها ).
<div id='adsense-mohamed'><data:post.body/></div>

<div id='adsense-algandy'>

اضف هنا كود الاعلان

</div>

<script type='text/javascript'>



function insertAfter(addition,target) {



var parent = target.parentNode;



if (parent.lastChild == target) {



parent.appendChild(addition);



} else {



parent.insertBefore(addition,target.nextSibling);



}



}



var adscont = document.getElementById(&quot;adsense-algandy&quot;);



var target = document.getElementById(&quot;adsense-mohamed&quot;);



var linebreak = target.getElementsByTagName(&quot;br&quot;);



if (linebreak.length &gt; 0){



insertAfter(adscont,linebreak[1]);



}



</script>

شرح تركيب اعلان داخل الخلاصة " Native Ads In-feed "
اعلان داخل الخلاصة

ابحث عن الكود التالي.
<b:loop values='data:posts' var='post'>

قم باستبداله بالكود التالي مع تغير المطلوب ( كود الاعلان - رقم مقال الاعلان في الصفحات ).
<b:loop index='x' values='data:posts' var='post'>

<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;item&quot;'>

<b:if cond='data:x==1'>

<div class='post'>

كود الاعلان

</div>

</b:if>

<b:if cond='data:x==3'>

<div class='post'>

كود الاعلان

</div>

</b:if>

<b:if cond='data:x==5'>

<div class='post'>

كود الاعلان

</div>

</b:if>

<b:if cond='data:x==7'>

<div class='post'>

كود الاعلان

</div>

</b:if>

</b:if>





وحتي الان افضل نوع من الاعلانات الاخيرة في الربح هو اعلان داخل المقالة، اما اعلان داخل الخلاصة الاقل ربح بسبب ضعف الزيارات علي الاقسام والصفحة الرئيسية.

































شرح تركيب اعلانات ادسنس الجديدة Native











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









من مميزات علانات Native داخل المقالة وفي الخلاصة :







الإعلانات مدمجة مع المحتوى ومصممة بدقة مع مسار القراءة والمشاهدة
إلإعلانات غير مزعجة للزائر سواء داخل المقال أو داخل الخلاصة
يمكن للناشر أن يقوم بغيير مضهر الإعلان بكل اريحية ليتناسب مع مضهر القاب والمحتوى
جودة الإعلانات عالية جدا تضهر العناوين بخط عريض مع إمكانية تغيير الخط ولون

طريقة انشاء وحدات ادسنس الجديدة Native :







سجل دخولك إلى حسابك في أدسنس
ثم إذهب إلى الإعلانات ثم أنقر على وحدة إعلانية جديدة
ثم إختار الإعلانات داخل الخلاصة أو الإعلانات داخل المقالة
ثم أكتب إسم لوحدتك الإعلانية للإعلان ثم تعديل نمط إعلانك ليطابق المحتوى لديك
ثم أنقر على حفظ للحصول على الشفرة




✔ شرح تركيب اعلان داخل الخلاصة " Native Ads In-feed "









إبحث عن الكود التالي :




<b:loop values='data:posts' var='post'>





قم باستبداله بالكود التالي مع تغير المطلوب ( كود الاعلان - رقم مقال الاعلان في الصفحات ) :




<b:loop index='x' values='data:posts' var='post'>



<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;item&quot;'>



<b:if cond='data:x==1'>



<div class='post'>



كود الاعلان



</div>



</b:if>



<b:if cond='data:x==3'>



<div class='post'>



كود الاعلان



</div>



</b:if>



<b:if cond='data:x==5'>



<div class='post'>



كود الاعلان



</div>



</b:if>



<b:if cond='data:x==7'>



<div class='post'>



كود الاعلان



</div>



</b:if>



</b:if>






✔ شرح تركيب اعلان داخل مَقالة " Native Ads In-articles "









بعد عمل نسخه احتياطيه للقالب إضغط على تحرير HTML إضغط على Ctrl+F  للبحث داخل القالب عن هذا لكود  التالي :







<data:post.body/>





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







اذا اردت ظهول الاعلان فى أول التدوينه مباشرة قم بوضع الكود قبل هذا الكود <data:post.body/>
أذا اردت ظهرو أعلان ادسنس فى اخر التدوينه قم بوضع الكود بعد هذا الكود <data:post.body/>










طرق اضافة اعلانات ادسنس داخل المواضيع او بشكل متداخل مع المحتوى






اقدم لكم هذا الشرح المفصل لطريقة اضافة اعلانات ادسنس او اي اعلانات داخل الموضوع في مدونات بلوجر
لمتابعة آخر اخبار ادسنس انضم الى مجموعتنا - ادسنس العرب


ملاحظه :

كنت قد شرحت في موضوع سابق تركيب اعلان ادسنس يمين او يسار الصفحه او في منتصف الصفحة بحيث يظهر بشكل منزلق امام الزائر ، اضغط هنا لقراءة الموضوع  .

اولا : اضافة اعلانات ادسنس في مقدمة او نهاية الموضوع
في البداية يجب عليك انشاء وحدة اعلانية بأي قياس تريد ثم الحصول على شفرة الأعلان ، ثم قم بتحويل الشفره  من هنا ثم انسخ الكود المحول وضعه في المكان المخصص في الكود التالي  :














<div align='center'><br />
<b:if cond='data:blog.pageType == "item"'><br />
كود ادسنس المحول هنا<br />
</b:if><br />
</div><br />


الآن انسخ الكود كاملا واحتفظ به في ملف تكست .



بعد ذلك توجه الى لوحة تحكم بلوجر ثم اختار قالب ثم اختار تحرير html وابحث عن هذا الكود <data:post.body/> باستخدام CTRL+F ، ستجد اكثر من كود ، الكود المطلوب هو عادة يكون الكود الثاني او الكود الذي يلي جملة اقرأ المزيد



ثم انسخ كود اعلان ادسنس الذي احتفظنا به في ملف التكست وضعه قبل <data:post.body/> اذا اردت ظهور الأعلان في مقدمة الموضوع  ، واذا اردت ظهور الأعلان نهاية الموضوع فضع كود اعلان ادسنس بعد <data:post.body/>



ثانيا : اضافة اعلان ادسنس وسط الموضوع
ابحث عن هذا الكود <data:post.body/>  في html  كما ذكرنا في الخطوة الأولى والذي يأتي بعد رابط اقرأ المزيد ثم احذفه وضع مكانه الكود التالي :












<div align='center'><br />
<b:if cond='data:blog.pageType == "item"'><br />
<div expr:id='"aim1" + data:post.id'><br />
</div><br />
<div style="clear:both; margin:10px 0"><br />
<!-- كود ادسنس المحول --><br />
</div><br />
<div expr:id='"aim2" + data:post.id'><br />
<data:post.body/><br />
</div><br />
<script type="text/javascript">
var obj0=document.getElementById("aim1<data:post.id/>");
var obj1=document.getElementById("aim2<data:post.id/>");
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- adsense --\x3E/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script><br />
</b:if><br />
</div><br />


ثم قم بتحول شفرة اعلان ادسنس من الموقع السابق  ثم انسخ الكود المحول وضعه مكان جملة : كود ادسنس المحول  ، واحفظ القالب



الآن كل ما عليك فعله هو: عند كتابة موضوع جديد انتقل من تأليف الى html وضع هذا الكود  <!-- adsense --> في المكان الذي تريد ظهور الأعلان به سواءا وسط الموضوع او نهايته او اي مكان ،  وسيظهر الأعلان في نفس المكان الذي وضعت به هذا الكود <!-- adsense -->



ثالثا : وضع اعلانين جنب بعض
ابحث في html عن <data:post.body/> كما ذكرنا سابقا وضع الكود التالي قبله او بعده حسب مكان ظهور الأعلان الذي تريده










<table cellpadding="0" cellspacing="0" border="0" style="width:100%;"><tr><td>كود الإعلان الأول بعد تحويله</td>
<td>كود الإعلان الثانى بعد تحويله</td>
</tr>

</table><br />






كود آخر:






<b:if cond='data:blog.pageType != "index"'><br />
<b:if cond='data:post.isFirstPost'><br />
<span class='FL'><br />
ضع هنا كود الإعلان الأول بعد تحويله<br />
</span><br />
<span class='FR'><br />
ضع هنا كود الإعلان الثاني بعد تحويله<br />
</span><br />
<div class='spacer'/><br />
</b:if></b:if>

رابعا : وضع اعلان ادسنس بشكل متداخل مع المحتوى




مدونة الكلباني









ابحث في html عن <data:post.body/> كما ذكرنا سابقا وضع الكود التالي قبله او بعده حسب مكان ظهور الأعلان الذي تريده مع تغيير كلمة left الى right اذا اردت ظهور الأعلان على يمين المحتوى
















<b:if cond='data:blog.pageType == "item"'><br />
<div style="float: left; margin: 10px 10px 10px 0;"><br />
كود ادسنس المحول هنا<br />
</div><br />
</b:if><br />


خامسا : كود الأعلان منتصف الصفحة منبثق مع علامة الأغلاق






ضع شفرة اعلان ادسنس في المكان المخصص ويفضل ان يكون الأعلان مربع  ثم انسخ الكود كاملا وضعه باضافة اداه من تخطيط في اي مكان ثم حفظ










<div id='fixedban' style='width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:150px;left:0px;0;z-index:999;-webkit-transform:translateZ(0);'><br />
<div><br />
<a id='close-fixedban' onclick='document.getElementById('fixedban').style.display = 'none';' style='cursor:pointer;'><img alt='close' src='https://goo.gl/dG4KcG' title='close button' style='vertical-align:middle;'/></a></div><br />
<div style='text-align:center;display:block;max-width:auto;height:auto;overflow:hidden;margin:auto'><br />
<br />
ضع كود ادسنس هنا<br />
</div><br />
</div><br />






تحديث : وسيلة اخرى اضافها جوجل حديثا



طريقة اضافة الأعلانات المدمجة مع المحتوى









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



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



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







مدونة الكلباني





شرح الطريقة :
العملية بسيطة جدا فقط ضع الكود التالي فوق علامة </body> ثم احفظ القالب وستلاحظ الفرق












<script type='text/javascript'><br />
//<![CDATA[<br />
// Lazy Load<br />
(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqgx7iM3EcdzG1kxvbXI1qQbFqc-ii5iQVbbSu0ryUkMymLfqqkF06zXveqNP3nBOJJJu998oxdp3Ng7M9EvvDRk0HGdpXq8Ngoj25YulJ_Ef-Tb1anStHKGGpWFDrvKjlf2ohuZcbWlBc/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});<br />
//]]><br />
</script><br />
<br />
<br />
 <br />