رفتن به مطلب

آموزش اضافه کردن باکس های تبلیغات متنی مثل این سایت


پست های پیشنهاد شده

با سلام میخواستم یه باکس مثل این سایت Tcs.com که زیراسلایدرش هست رو به قالبم اضافه کنم . توی نت زیادگشتم هیچ افزونه ای نبود فقط باید کدش رو دستی بنویسم . لطفا کمکم کنید چجوری این کارو انجام بدم ؟

لینک به ارسال

سلام خوش اومدید به انجمن .

اینا اسلایدر هستن . slick رو دانلود کنید و در پوشه قالبتون قرار بدید .

بعد این کد ها رو بین تگ head قالبتون قرار بدید .


<script type="text/javascript" src="slick/slick.min.js"></script>
<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
// Add the new slick-theme.css if you want the default styling
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>

باید حتما به جی کوئری و میگریت (migrate) هم لینک داده باشید .

حالا کد ها برای ایجاد این اسلایدر :


محل مورد نظر :
<div style=border-color:#FF5F5F;class=trail>
<div class="slick-slide">
متن آزمایشی 1
</div>
<div class="slick-slide">
متن آزمایشی 2
</div><div class="slick-slide">
متن آزمایشی 3
</div>
</div><!--trail-->بین تگ head:
<script type="text/javascript">
$(document).ready(function(){
$('.trail').slick({
slidesToShow: 1,
slidesToScroll: 1,
vertical:false,
rtl:true,
draggable:true,
infinite:true,
autoplay:true,
autoplaySpeed:2000,
dots:true,
fade: true,
cssEase: 'linear'
});
});
</script>

اسلایدر شما حاضره !

لینک به ارسال

ممنون آیا این دقیقا مثل همون باکس تبلیغاتی هستش که بهتون گفتم ؟ وبعدش هم چجوری کد

(migrate) رو به قالب هم اضافه کنم ؟

بله دقیقا همونه

همونجوری که به جی کوئری لینک دادید ، یا فایلشو دانلود کنید و در پوشه قالبتون قرار بدید و این کد رو بین تگ head بگذارید :

<script language="javascript" type="text/javascript" src="<?php bloginfo('template_directory');?>/js/migrate-1.2.1.min.js"></script>

و یا دانلود نکنید و این کد رو بگذارید :

<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

لینک به ارسال

ممنون ازرهنمای خوب تون من یه قسمت دیگه مشکل دارم فایل که دادی رو آپلودکردم درپوشه قالبم وکدهای مربوط به تگ head روهم فراخوانی کردم فقط الان موندم اون فایل اچ تی ام ال رو چی جوری بذارم زیراسلایدرقالب سایتم . آدرس سایت هم است www.bartar.af لطفا همین قسمت رو هم برام توضیع بدید ممنون میشم

لینک به ارسال

ممنون ازرهنمای خوب تون من یه قسمت دیگه مشکل دارم فایل که دادی رو آپلودکردم درپوشه قالبم وکدهای مربوط به تگ head روهم فراخوانی کردم فقط الان موندم اون فایل اچ تی ام ال رو چی جوری بذارم زیراسلایدرقالب سایتم . آدرس سایت هم است www.bartar.af لطفا همین قسمت رو هم برام توضیع بدید ممنون میشم

خواهش میکنم ، منظورتون کدوم فایل اچ تی ام اله ؟

لینک به ارسال

منظورم این کدهستش .


محل مورد نظر :
<div style=border-color:#FF5F5F;class=trail>
<div class="slick-slide">
متن آزمایشی 1
</div>
<div class="slick-slide">
متن آزمایشی 2
</div><div class="slick-slide">
متن آزمایشی 3
</div>
</div><!--trail-->بین تگ head:
<script type="text/javascript">
$(document).ready(function(){
$('.trail').slick({
slidesToShow: 1,
slidesToScroll: 1,
vertical:false,
rtl:true,
draggable:true,
infinite:true,
autoplay:true,
autoplaySpeed:2000,
dots:true,
fade: true,
cssEase: 'linear'
});
});
</script>

لینک به ارسال

منظورم این کدهستش .


محل مورد نظر :
<div style=border-color:#FF5F5F;class=trail>
<div class="slick-slide">
متن آزمایشی 1
</div>
<div class="slick-slide">
متن آزمایشی 2
</div><div class="slick-slide">
متن آزمایشی 3
</div>
</div><!--trail-->بین تگ head:
<script type="text/javascript">
$(document).ready(function(){
$('.trail').slick({
slidesToShow: 1,
slidesToScroll: 1,
vertical:false,
rtl:true,
draggable:true,
infinite:true,
autoplay:true,
autoplaySpeed:2000,
dots:true,
fade: true,
cssEase: 'linear'
});
});
</script>

هر جایی که مایلید میتونید این کد رو بگذارید ، البته این قسمتو تو تگ هد بگذارید بهتره :


بین تگ head:
<script type="text/javascript">
$(document).ready(function(){
$('.trail').slick({
slidesToShow: 1,
slidesToScroll: 1,
vertical:false,
rtl:true,
draggable:true,
infinite:true,
autoplay:true,
autoplaySpeed:2000,
dots:true,
fade: true,
cssEase: 'linear'
});
});
</script>

و این قسمت محل مورد نظر :


محل مورد نظر :
<div style=border-color:#FF5F5F;class=trail>
<div class="slick-slide">
متن آزمایشی 1
</div>
<div class="slick-slide">
متن آزمایشی 2
</div><div class="slick-slide">
متن آزمایشی 3
</div>
</div><!--trail-->

که محل مورد نظر شما در قالبتون میشه container سوم

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...