به تازگی یکی از خوانندگان ما از ما در مورد نحوه اضافه کردن دکمه های CSS در تم وردپرس خود پرسید. این مقاله،نشان میدهد که چگونه شما می توانید به راحتی دکمه های CSS در تم وردپرس خود با استفاده از CSS بسیار کمی و HTML اضافه کنید
شبح دکمه چیست؟
شبح دکمه اصطلاحات طراحی وب مورد استفاده برای دکمه های شفاف که به پس زمینه خود را ترکیب و قابل توجه توسط مرز در اطراف آنها است.
ایجاد تماس های عادی به دکمه های عمل در وردپرس کاملا آسان است. شما حتی می توانید آنها را در پست ها و صفحات خود بدون نوشتن CSS یا HTML اضافه کنید.
اضافه کردن دکمه های شبح در وردپرس
همانطور که قبلا ذکر شد، شما نیاز به استفاده از یک کمی از CSS و HTML برای اضافه کردن دکمه شبح در تم وردپرس خود دارید
شما خواهید یک سرویس گیرنده FTP برای اتصال به وب سرور شما نیاز دارند. پس از اتصال، به / فایل wp-content / themes در / شما تم / پوشه بروید و در مکانی فایل را ببندید. این فایل را ویرایش کنید در یک ویرایشگر متن و سپس کد زیر را به آن اضافه کنید
[php]
.ghost-button { display: inline-block; width: 200px; padding: 8px; color: #fff; border: 2px solid #fff; text-align: center; outline: none; text-decoration: none; transition: background-color 0.2s ease-out, color 0.2s ease-out; } .ghost-button:hover, .ghost-button:active { background-color: #fff; color: #000; transition: background-color 0.3s ease-in, color 0.3s ease-in; }
[/php]
تغییرات را ذخیره کنید و فایل را به سرور آپلود کنید.
حالا هر زمان که شما می خواهید برای نمایش دکمه شما باید کلاس = “شبح دکمه” را اضافه کنید.
محل کد HTML برای لینک دانلود را تعیین کنید و کلاس CSS مثل این را اضافه کنید:
<a href=”http://example.com/downloads/” class=”ghost-button”> دانلود در حال حاضر </a> را
حالا دخیره سازی را انجام دهید اکنون شما یک دکمه شبه زیبا به جای لینک ساده و قدیمی را ببینید.
امیدواریم این مقاله به شما در نحوه اضافه کردن دکمه های CSS در تم وردپرس کمک کرده باشد.برای مشاهده مقالات بیشتر درباره ی طراحی قالب وردپرس به http://www.on5.ir مراجعه نمایید.
آنفایو مرجع مقالات تخصصی طراحی قالب وردپرس