کد تبلیغات متنی
کد تبلیغات متنی با سی اس اس
این جعبه لینک زیبا بر اساس سی اس اس طراحی شده و هیچ تاثیری در سرعت لود وبلاگ یا وبسایت شما نداره پس با کدی ساده به زیبایی وبسایت خود بیفزایید.
خب دوستان عزیز کافیه که <head> پیدا کنید و این کدها رو زیر اون قرار بدید:
<style>
.animatedButton{
font-family: tahoma;
text-decoration: none !important;
background-color:#3F4247;
padding-left: 20px;
padding-right: 20px;
width:210px;
height: 38px;
margin-bottom:10px;
line-height: 38px !important;
display: inline-block;
border: 2px solid #E1E1E1;
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-transition: all 1.2s linear;
-moz-transition: all 1.2s linear;
-o-transition: all 1.2s linear;
transition: all 1.2s linear;
}
.animatedButtonText{
font-family: courier new;
line-height: 38px !important;
display: block;
font-size: 14px;
color: #ff0000;
text-align:center;
-webkit-transition: all 1.2s linear;
-moz-transition: all 1.2s linear;
-o-transition: all 1.2s linear;
transition: all 1.2s linear;
border-bottom:1px dashed #FFC0F3;
}
.animatedButton:hover{
height:75px;
}
.animatedButtonExtraText{
font-family: tahoma;
font-size:12px;
color:#fff;
overflow: hidden;
direction:rtl;
text-align:right;
float:right;
}
</style>
و بین تگهای body ، کد زیر رو قرار بدید و آدرس،عنوان و توضیحات رو جایگزین کنید:
<a target="_blank" href="http://mihanweb.blogsky.com" class="animatedButton"> <span class="animatedButtonText">دنا سافت</span> <span class="animatedButtonExtraText">مجله بزرگ نرم افزار و بازی</span></a>
توجه داشته باشید که برای تغییر رنگ بک گراند اصلی ، این کد رنگ رو پیدا کنید و تغییرش بدید : ۳F4247
برای تغییر رنگ عنوان لینک ( دنا سافت ) ، این کد رنگ رو تغییر بدید: ff0000
برای تغییر رنگ خط چین های وسط ، این کد رنگ رو تغییر بدید: FFC0F3
برای تغییر رنگ دور کادر ، این کد رنگ رو تغییر بدید: E1E1E1
و برای تغییر رنگ توضیحات ( در این جا منظور،ارائه دهنده انواع خدمات مفید و کاربردی برای شما ) ،این کد رنگ رو تغییر بدید : FFF
توجه داشته باشیدکه تغییرات دیگه ای هم میتونید توی کدها صورت بدید اما بهرحال فکر میکنم تغییر رنگ از همشون مهمتر بود و من فقط روش تغییر رنگ رو توضیح دادم.
کد استفاده در ابزارک های وردپرس :
<style>
.animatedButton{
font-family: tahoma;
text-decoration: none !important;
background-color:#3F4247;
padding-left: 20px;
padding-right: 20px;
width:240px;
height: 38px;
margin-bottom:10px;
line-height: 38px !important;
display: inline-block;
border: 2px solid #E1E1E1;
overflow: hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-transition: all 1.2s linear;
-moz-transition: all 1.2s linear;
-o-transition: all 1.2s linear;
transition: all 1.2s linear;
}
.animatedButtonText{
font-family: courier new;
line-height: 38px !important;
display: block;
font-size: 14px;
color: #ff0000;
text-align:center;
-webkit-transition: all 1.2s linear;
-moz-transition: all 1.2s linear;
-o-transition: all 1.2s linear;
transition: all 1.2s linear;
border-bottom:1px dashed #FFC0F3;
}
.animatedButton:hover{
height:75px;
}
.animatedButtonExtraText{
font-family: tahoma;
font-size:12px;
color:#fff;
overflow: hidden;
direction:rtl;
text-align:right;
float:right;
}
</style>
<html>
<body>
<a target="_blank" href="http://dena-soft.ir" class="animatedButton">
<span class="animatedButtonText">دنا سافت</span>
<span class="animatedButtonExtraText">مجله بزرگ نرم افزار و بازی </span></a><br/>
<a target="_blank" href="http://dena-soft.ir" class="animatedButton">
<span class="animatedButtonText">محل تبلیغات شما</span>
<span class="animatedButtonExtraText">ماهانه فقط 5 هزار تومان </span></a><br/>
<a target="_blank" href="http://dena-soft.ir" class="animatedButton">
<span class="animatedButtonText">محل تبلیغات شما</span>
<span class="animatedButtonExtraText">ماهانه فقط 5 هزار تومان </span></a><br/>
<a target="_blank" href="http://dena-soft.ir" class="animatedButton">
<span class="animatedButtonText">محل تبلیغات شما</span>
<span class="animatedButtonExtraText">ماهانه فقط 5 هزار تومان </span></a><br/>
<a target="_blank" href="http://dena-soft.ir" class="animatedButton">
<span class="animatedButtonText">محل تبلیغات شما</span>
<span class="animatedButtonExtraText">ماهانه فقط 5 هزار تومان </span></a>
</body>
</html>
مطالب زیر را حتما بخوانید:
قوانین ارسال دیدگاه در سایت
- چنانچه دیدگاهی توهین آمیز باشد و متوجه اشخاص مدیر، نویسندگان و سایر کاربران باشد تایید نخواهد شد.
- چنانچه دیدگاه شما جنبه ی تبلیغاتی داشته باشد تایید نخواهد شد.
- چنانچه از لینک سایر وبسایت ها و یا وبسایت خود در دیدگاه استفاده کرده باشید تایید نخواهد شد.
- چنانچه در دیدگاه خود از شماره تماس، ایمیل و آیدی تلگرام استفاده کرده باشید تایید نخواهد شد.
- چنانچه دیدگاهی بی ارتباط با موضوع آموزش مطرح شود تایید نخواهد شد.
نظرات کاربران