سبد خرید

نمایش خلاصه ای از خرید هایی که شما انجام خواهید داد

سبد خرید خالی می باشد
مبلغ کل
0
تسویه حساب

آموزش اضافه کردن آیکن منو در وردپرس
ملت وب
ملت وب
تعداد کل دانلود ها : 1080908
تعداد کل مطالب : 1851

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

تعداد دانلود:
0
تعداد بازدید:
1000
تاریخ:
دسته بندی:

هشتگ ها :

#آموزش وردپرس

آیا می خواهید آیکون های تصویری را در منوی های وردپرس خود اضافه کنید؟ اخیرا یکی از کاربران ما یک راه آسان برای اضافه کردن آیکون های منو درخواست کرد. در این مقاله ما به شما نحوه اضافه کردن آیکون های تصویری با منوی های ناوبری در WordPress را نشان می دهیم.

 

چرا باید آیکون تصویر را با منوها اضافه کنید؟

معمولا، منوهای ناوبری وردپرس ، پیوندهای متن ساده هستند. این لینک ها برای اکثر وب سایت ها کار می کنند، با این حال، می توانید با اضافه کردن آیکون های تصویری، منوی ناوبری خود را بیشتر تعاملی کنید.

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

با این گفتگو، بیایید نگاهی به چگونگی اضافه کردن آیکون های تصویری با منوی های ناوبری در WordPress اضافه کنیم.

روش 1: اضافه کردن آیکون های منو با استفاده از یک پلاگین

این روش ساده تر است و برای کاربران مبتدی توصیه می شود زیرا کد را شامل نمی شود.

اولین کاری که باید انجام دهید اینست که Plugin Menu Image را نصب و فعال کنید .

پس از فعال سازی، شما باید از صفحه نمایش»منوها بازدید کنید .

از اینجا میتوانید بر روی هر مورد منو در ستون سمت راست کلیک کنید تا آن را گسترش دهید. دکمه های منو و دکمه Image on hover را در تنظیمات برای هر مورد مشاهده خواهید کرد.

دکمه های تصویر منو

با استفاده از این دکمه ها، می توانید آیکون تصویر منو را که می خواهید استفاده کنید را انتخاب کرده یا آپلود کنید. اگر می خواهید، می توانید فقط یک تصویر منو را آپلود کنید و تصویر hover را نادیده بگیرید.

در منوی «اندازه تصویر»، می توانید یک اندازه برای نماد تصویر انتخاب کنید. این اندازه برای هر دو آیکون تصویر و تصویر در حالت شنا اعمال می شود.

این پلاگین با گزینه های متعدد برای انتخاب می باشد. با این حال توصیه میکنیم با استفاده از اندازه 24 × 24 یا 36 × 36 اندازه آیکونهای منو را کوچک نگهدارید.

اندازه آیکون منوها

اگر می خواهید اندازه سفارشی خود را برای تصاویر منو اضافه کنید، می توانید این کار را با اضافه کردن این کد در فایل functions.php یا پلاگین خاص سایت خود انجام دهید .

add_filter( 'menu_image_default_sizes', function($sizes){
  
  // remove the default 36x36 size
  unset($sizes['menu-36x36']);
  
  // add a new size
  $sizes['menu-50x50'] = array(50,50);
  
  // return $sizes (required)
  return $sizes;
  
});

محل عنوانشما همچنین می توانید موقعیت عنوان را در بالا، زیر، قبل یا بعد از نماد تصویر تنظیم کنید. همچنین اجازه می دهد تا عنوان خود را پنهان کنید و تنها نماد تصویر را برای هر یک از منوی های ناوبری نمایش دهید.

هنگامی که تنظیمات را پیکربندی کرده اید، به سادگی آیکون های تصویری را به همه موارد منو ناوبری خود اضافه کنید. بعد، شما باید بر روی دکمه "ذخیره منو" کلیک کنید تا آیکون های منو را در عمل ببینید.

آیکون های تصویری در منوی ناوبری

روش 2: اضافه کردن آیکون های منو با استفاده از قطعه کد

این روش برای کاربران با تجربه تر است که راه خود را در سراسر CSS می دانند.

ابتدا باید به Media مراجعه کنید »افزودن جدید برای بارگذاری تمام آیکون های تصویر خود در وردپرس.پس از آپلود، شما باید URL های خود را کپی کنید و آنها را در یک ویرایشگر متن مثل Notepad کپی کنید.

بعد، شما باید به نمایشبروید »فهرست ها و روی دکمه« گزینه های صفحه »در گوشه سمت راست بالای صفحه خود کلیک کنید. در گزینه های صفحه، شما باید گزینه 'CSS Classes' را بررسی کنید.

اضافه کردن کلاس های CSS

پس از آن، به پایین و بر روی هر مورد منو کلیک کنید تا تنظیمات آن گسترش یابد. شما یک فیلد 'CSS Classes (optional)' که در آن شما نیاز به اضافه کردن یک نام کلاس CSS برای مورد منو خواهید داشت.

نام کلاس را اضافه کنید

حالا شما باید این CSS سفارشی را به موضوع خود اضافه کنید.

.homeicon {
background-image: url('http://www.example.com/wp-content/uploads/2018/09/home.png');
background-repeat: no-repeat;
background-position: left;
padding-left: 5px;
}

در این قطعه CSS، .homeicon نام کلاس است که شما در کادر کلاس CSS در بالا اضافه کردید.

بسته به تم شما، ممکن است لازم باشد کمی CSS را نیشگون بگیرید تا جای مناسب برای آیکون های منو پیدا کنید. هنگامی که از نتایج شما راضی هستید، روند را برای تمام آیتم های منو تکرار کنید.

همه چیز هست ما امیدواریم که این مقاله به شما کمک کند تا نحوه اضافه کردن آیکون های تصویری با منوهای ناوبری در وردپرس را یاد بگیرید.

محصولات مشابه فروشی
هشتگ ها :

این محصول بدون نظر می باشد شما میتوانید اولین نظر را ثبت کنید

ارسال نظر

آخرین های مشابه مشاهده بیشتر

  • تلفن : 04136383693
  • پیامک : 500020606688
  • آدرس : آذربایجان شرقی، تبریز، شهرک مصلی، خیابان راجی، راجی 4، کوچه بیست هشتم، قطعه 1339، طبقه چهارم

ملت وب در سال 1393 فعالیت خود را در چهار بخش قالب های آماده، طراحی لوگو، طراحی سایت، طراحی بنر آغاز کرده است، که در مدت بسیار کم با تلاش های بی وقفه خود و همکاران توانسته بزرگترین وب سایت ارائه دهنده قالب های با کیفیت در ایران باشد رمز موفقیت شرکت ملت وب پشتیبانی بی دریغ از کاربران خود می باشد ما موقعیت خود را مدیون مشتریان وفادار خود هستیم پس همیشه همراهشان خواهیم بود .

  • logo-samandehi