سیستم منوی وردپرس دارای یک ویژگی داخلی است که می توانید توضیحات را با موارد منو اضافه کنید. با این حال ، این ویژگی به طور پیش فرض پنهان است. حتی در صورت فعال بودن ، نمایش آنها بدون افزودن کد پشتیبانی نمی شود. بیشتر مضامین با توصیف موارد منو طراحی نشده اند. در این مقاله ما به شما نشان خواهیم داد که چگونه می توانید توضیحات منو را در وردپرس فعال کنید و چگونه می توانید توضیحات منو را در تم های وردپرس خود اضافه کنید.
توجه: در این آموزش لازم است که درک درستی از HTML ، CSS و توسعه قالب WordPress داشته باشید.
چه زمانی و چرا می خواهید توضیحات منو اضافه کنید؟ h4>
برخی از کاربران فکر می کنند افزودن توضیحات منو به سئو کمک می کند. با این حال ، ما فکر می کنیم دلیل اصلی اینکه شما می خواهید از آنها استفاده کنید ارائه تجربه کاربری بهتر در سایت شما است.
با استفاده از توضیحات می توان به بازدیدکنندگان گفت که اگر روی مورد منو کلیک کنند ، چه چیزی پیدا می کنند. یک توصیف جذاب باعث جذب بیشتر کاربران به کلیک بر روی منوها می شود.
مرحله 1: توضیحات منو را روشن کنید h4>
به ظاهر »منوها بروید. روی دکمه گزینه های صفحه در گوشه سمت راست بالای صفحه کلیک کنید. کادر توضیحات را علامت بزنید.
این قسمت توضیحات را در موارد منو شما فعال می کند. مانند این:
اکنون می توانید توضیحات منو را به موارد موجود در فهرست وردپرس خود اضافه کنید. با این حال ، این توصیفات هنوز در موضوعات شما نشان داده نمی شود. برای نمایش توضیحات منو ، باید مقداری کد اضافه کنیم.
مرحله 2: کلاس واکر را اضافه کنید: h4>
کلاس واکر کلاس موجود را در وردپرس گسترش می دهد. در واقع فقط یک خط کد برای نمایش توضیحات مورد منو اضافه می کند. این کد را در پرونده functions.php
طرح زمینه خود اضافه کنید.
منوی کلاس با توصیف Walker_Nav_Menu را گسترش می دهد { تابع start_el (& $ خروجی ، $ مورد ، $ عمق ، $ args) { $ wp_query جهانی؛ $ indent = ($ عمق)؟ str_repeat (" t"، $ عمق): ''؛ $ class_names = $ value = ""؛ $ class = خالی ($ item-> کلاس)؟ array (): (array) $ item-> class؛ $ class_names = join (''، apply_filters ('nav_menu_css_class'، array_filter ($ class)، $ item))؛ $ class_names = 'class = "'. esc_attr ($ class_names). '"'؛ $ خروجی. = $ تورفتگی. '
$ مشخصه =! خالی ($ item-> attr_title)؟ ‘title = “‘. esc_attr ($ item-> attr_title). ‘”‘: ”؛
ویژگی $. =! خالی ($ item-> target)؟ ‘target = “‘. esc_attr ($ item-> target).” “‘:’ ‘؛
ویژگی $. =! خالی ($ item-> xfn)؟ ‘rel = “‘. esc_attr ($ item-> xfn).” “‘:’ ‘؛
ویژگی $. =! خالی ($ item-> url)؟ ‘href = “‘. esc_attr ($ item-> url).” “‘:’ ‘؛
$ item_output = $ args-> قبل از آن؛
$ item_output. = ‘‘؛
$ item_output. = $ args-> link_before. apply_filters (‘the_title’ ، $ item-> عنوان ، $ item-> ID). $ args-> link_after ؛
$ item_output. = ‘
‘. $ item-> توضیحات. ‘‘؛
$ item_output. = ‘‘؛
$ item_output. = $ args-> after؛
$ output. = apply_filters (‘walker_nav_menu_start_el’، $ item_output، $ item، $ deep، $ args)؛
}
}
مرحله 3. Walker را در wp_nav_menu فعال کنید h4>
مضامین وردپرس از wp_nav_menu استفاده می کنند () عملکرد برای نمایش منوها. ما همچنین یک آموزش برای مبتدیان در مورد نحوه افزودن منوهای پیمایش سفارشی در مضامین وردپرس . بیشتر مضامین وردپرس منوها را در الگوی header.php
اضافه می کنند. با این حال ، ممکن است که تم شما از فایل الگوی دیگری برای نمایش منوها استفاده کرده باشد.
کاری که اکنون باید انجام دهیم این است که عملکرد wp_nav_menu ()
را در طرح زمینه خود پیدا کنیم (به احتمال زیاد در header.php) و آنرا به همین صورت تغییر دهیم.
'اولیه' ، 'menu_class' => 'nav-menu' ، 'walker' => $ walker))؛ ؟>
در خط اول $ walker
را تنظیم می کنیم تا از کلاس واکر که قبلاً در توابع.php
تعریف کردیم استفاده کند. در خط دوم کد ، تنها آرگومان اضافی که باید به آرگومان های wp_nav_menu موجود خود اضافه کنیم ، 'walker' => $ walker
است.
مرحله 4. حالت دادن به توضیحات h4>
کلاس واکر که قبلاً اضافه کردیم ، توضیحات مورد را در این خط کد نمایش می دهد:
$ item_output. = '
'. $ item-> توضیحات. ''؛
کد بالا با افزودن برچسب
باعث شکست خط به مورد منو می شود و سپس توصیفات شما را در یک بازه با کلاس sub قرار می دهد. مانند این:
ما چه کسانی هستیم؟
برای تغییر نحوه نمایش توضیحات در سایت خود ، می توانید CSS را در صفحه سبک طرح زمینه خود اضافه کنید. ما این را در بیست و دوازده آزمایش کردیم و از این css استفاده کردیم.
.منو-مورد { مرز چپ: 1 پیکسل جامد # سی سی؛ } span.sub { نوع قلم: مورب؛ اندازه قلم: کوچک؛ }
امیدواریم که این مقاله برای شما مفید واقع شود و به شما کمک کند منوهایی با ظاهر زیبا با توصیف منو در موضوع خود ایجاد کنید. سوالی دارید؟ آنها را در زیر بنویسید
منابع اضافی h4>
نحوه سبک سازی وردپرس منوهای پیمایش
منبع:
https://www.wpbeginner.com/wp-themes/how-to-add-menu-descriptions-in-your-wordpress-themes/.