تبلیغات

نکته

بخشی از این المان باید خارج از محتوای صفحه قرار گیرد

تبلیغات اگر ثابت یا زمانبندی نشده باشد، میتوان آن را درون محتوای صفحه قرار داد. به عنوان مثال، محبوب ترین تبلیغات در دستگاه های تلفن همراه، بنرهای 50⨯300 و 250⨯300 هستند. اینها را میتوان با افزودن کد زیر در محتوای صفحه هر زمان که به آنها نیاز داشت ایجاد کرد.

بنر 50✖300 درون محتوا

html

<div class="ad-300x50">
  <!-- put your ad code here -->
</div>

بنر 250⨯300 درون محتوا

html

<div class="ad-300x250">
  <!-- put your ad code here -->
</div>

تبلیغات چسبنده و ثابت 300⨯50

نکته

کد تبلیغ زیر باید خارج از محتوای صفحه قرار گیرد

html

<div class="ad-300x50 ad-300x50-fixed">
  <!-- put your ad code here -->
</div>

این تبلیغ بالای فوتر ثابت خواهد ماند.

تبلیغ هنگام اسکرول

نکته

کد تبلیغ زیر باید خارج از محتوای صفحه قرار گیرد

html

<div class="scroll-ad">
    <img src="img.jpg" class="shadow-l">
    <h1 class="text-uppercase font-900 font-18 color-white">Title</h1>
    <em class="font-12">Flexibile, fast and fully featured. <br> Pure mobile awesome!</em>
    <a href="#">Button</a>
</div>

این تبلیغ هنگام اسکرول ظاهر میشود، و در بالا و پایین صفحه پنهان میشود. آن را میتوان در صفحه component-fixed-ads.html یافت.

تبلیغات زمانبندی شده

نکته

کد زیر را میتوان در هر جایی قرار داد، اما مودال آن باید خارج از محتوای صفحه قرار گیرد.

data-menu="ad-timed-1" data-timed-ad="5"

خود کادر تبلیغ زمانبندی شده، یک منوی مودال است که توسط کد بالا فعال میشود. data-timed-ad زمانِ نمایشِ دکمه‌ی بستن را نشان میدهد. برای دیدن پنجره‌های مودال این تبلیغات، فایل component-ad-timed.html را بررسی کنید. کافیست آنها را کپی پیست کنید و محتوای داخل آن را با محتوای خودتان جایگزین کنید.

نمایش خودکار تبلیغات زمانبندی شده

همچنین میتوانید با افزودن پارامتر زیر به کد بالا، یک تبلیغ زمانبندی شده را بطور خودکار راه‌اندازی کنید.

data-menu="ad-timed-1" data-timed-ad="5" data-auto-show-ad="10"

data-auto-show-ad در عرض چند ثانیه نمایش داده میشود و به طور خودکار آگهی را در عرض 10 ثانیه نشان میدهد. برای اضافه کردن این مورد به صفحه بدون اینکه دکمه ای قابل مشاهده باشد، کافی است یک href="#" خالی با این داده ها اضافه کنید و هیچ رنگی به آن اضافه نکنید. آن را در جایی از صفحه نگه دارید.