خرید هاست ارزدیجیتال
حراجی دامنه های ویژهمشاهده





تبلیغات
تبلیغات تبلیغات
تبلیغات ژاکت, مرجع خرید قالب و افزونه وردپرسی اورجینال

آموزش افزودن آیکون به فهرست وردپرس

مقالات,آموزش,ترفند , وردپرس

اگر از دنبال کنندگان همیشگی بیست اسکریپت بوده باشید ، پیرو مقاله قبلی که با عنوان افزودن آیکون به منو در وردپرس با Menu Image منتشر نمودم، در آن به معرفی افزونه‌ای کاربردی برای افزودن آیکون پرداختیم که با کمک آن میتوانستید به منوها یا همان فهرست‌های سایت وردپرسی خود هر آیکونی که مدنظر شماست اضافه کنید. حال در این آموزش قصد دارم تا این کار را با استفاده از کدنویسی آموزش دهم، پس تا انتها همراه باشید.

 

آموزش افزودن آیکون به فهرست وردپرس

 

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

برای افزودن آیکون به منو با استفاده از کدنویسی لازم است تا فایل استایل قالب خود را کمی شلوغتر کنید و کدها و کلاس‌هایی را برای نمایش آیکون به آن اضافه کنید؛ برای این منظور ابتدا هر تعداد که آیکون مد نظر شماست را در پوشه تصاویر قالب خود اضافه کنید و سپس مشابه کد زیر عمل کنید.

 

.homepage {
background-image: url('home.png');
background-repeat: no-repeat;
background-position: right;
padding-right: ۵px;
}

 

مطابق کد فوق ابتدا یک کلاس برای هر آیکون تعریف کنید، که در اینجا مانند خط اول عنوان آیکون خانه را با نام homepage. تعیین کرده‌ام (دقت کنید که نقطه آن را نیز بگذارید). سپس در خط دوم آیکون مورد نظر خود را با نام home.png و یا هر فرمت دیگری که قرار دارد را آپلود کرده و در کد استایل نام و فرمت آن را مانند نمونه وارد کنید. و در نهایت در خطوط سوم، چهارم و پنجم موقعیت آیکون و حاشیه آن را از کناره ها تعیین کنید.

 

پس از اینکه استایل مورد نظر را در قالب اضافه کردید، حال وارد پیشخوان وردپرس شده و به مسیر نمایش> فهرست‌ها مراجعه کرده و منوی مورد نظر را انتخاب کنید. ابتدا مطابق تصویر زیر بر روی گزینه تنظیمات که در بالای صفحه قرار دارد کلیک کنید و تیک گزینه های مشخص شده را فعال کنید.

 

آموزش افزودن آیکون به فهرست وردپرس

 

پس از اینکه گزینه css classes را فعال کنید مشابه تصویر زیر در بخش منوهایی که اضافه می‌کنید فیلدی با عنوان css classes افزوده خواهد شد که مشابه نمونه فقط کافیست نام کلاس مورد نظر را وارد کنید تا آیکون مد نظر شما در کنار منو نمایش داده شود.

 

آموزش افزودن آیکون به فهرست وردپرس

 

موفق باشید.

این مقاله چقدر براتون مفید بود؟

از ۱ تا ۵ امتیاز بدید.

میانگین رتبه 5 / 5. تعداد رای : 1

تا حالا کسی رای نداده! اولین نفر شما باشید.

دانلود

هاست ارزان، لایت اسپید، سرور مجازی منطبق با اسکریپت های 20script کلیک کنید >

خرید ارز
مطلب مفیدی بود ؟
نویسنده : تیم محتوای 20اسکریپت 0 مقالات,آموزش,ترفند , وردپرس
لینک کوتاه مطلب : https://www.20script.ir/?p=27683
کلمات کلیدی پست :
مطالب مرتبط
8,787آموزش افزودن متن دلخواه آخر مطالب وردپرس تاریخ : 2016/03/13
11,732ساخت نقشه در وردپرس با افزونه HTML5 Maps تاریخ : 2019/12/28
16,562افزونه ابزارها و هک های پیشرفته وردپرس Ultimate Tweaker نسخه 2.4.4 تاریخ : 2017/07/1
25,096نمایش مطالب دسته بندی خاص در یک برگه تاریخ : 2018/11/10
7,432قالب وردپرس ساختمانی و دکوراسیون Remould تاریخ : 2018/11/24
8,536ایجاد صفحه پروفایل سفارشی نویسندگان در وردپرس تاریخ : 2018/03/21
9,991دانلود قالب عکاسی BORDER برای وردپرس تاریخ : 2018/01/16
17,336آموزش درج تاریخ بروزرسانی مطالب در وردپرس تاریخ : 2016/09/16
9,254لینک کردن خودکار متن نوشته در پست وردپرس تاریخ : 2016/06/27
7,220آموزش رفع خطای Missing a temporary folder در وردپرس تاریخ : 2019/07/4
9,422دانلود پوسته پزشکی MedicalDoctor برای وردپرس تاریخ : 2016/08/5
11,583دانلود قالب پی سی جوک برای وردپرس تاریخ : 2015/02/5
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت هاقالب عشق بین انگشت ها
قالب دخترونه و آرایشقالب دخترونه و آرایش
قالب زیبای ماشینقالب زیبای ماشین
قالب فانتزی و طنز چِشمقالب فانتزی و طنز چِشم
قالب دختر رویاییقالب دختر رویایی
قالب وبلاگ دکوراسیونقالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درختقالب وبلاگ کلبه و درخت
قالب دختر زیباقالب دختر زیبا
قالب پسرونه غمگینقالب پسرونه غمگین
قالب عاشقانه قلبقالب عاشقانه قلب
بیست اسکریپت
اسکریپت
profile
sourceforge
profile webmaster
profile check
checker list
checker
checker
upload file