Intereting Posts
Добавить новую кнопку в WP-меню Задачи Cron для деактивированных плагинов Замена textarea на wp_editor Как установить wp_options в functions.php для удаления основной страницы по умолчанию медленный WP_Query для пользователя, не являющегося администратором Есть ли способ проверить, успешно ли запущена функция, работающая только с обновлением плагина? Переопределение вкладки продукта под изображением продукта Попытка изменить archive.php, чтобы показывать только сообщение, с изображением Включить пользовательские стили без включения wp-load Активная тема отвечает на запрос изменения темы, чтобы предупредить пользователя Отображать имя пользователя в качестве родительского пункта меню Как использовать пустое пространство слева и справа от сообщения? Как изменить ссылки комментатора на / user / user_id? Как динамически изменять точки текста на пользовательской странице? Можно ли добавить страницу администратора с помощью add_submenu_page () и передать var в строке запроса?

Отображать изображения вместо текста в меню

Я работаю над настраиваемой темой. В этой теме я создаю меню под названием «social» для ссылок на социальные сайты, такие как твиттер, facebook и т. Д.

Теперь вместо текста я хотел бы отображать значки социальных сетей. Как я могу это сделать? Сделать каждый пункт меню изображением?

Благодарю.

Solutions Collecting From Web of "Отображать изображения вместо текста в меню"

Это было бы моим решением проблемы, если вы захотите в любое время внести изменения в контенте (область администратора) на сайте. Если вы хотите, чтобы статическое меню просто вставило шаг 1, где вам это нужно, и пропустите все остальное. Надеюсь, поможет!

Ваш КОД будет выглядеть примерно так:

Шаг 1) Создайте меню и вставьте изображения в папку изображений в дочерней теме

<ul id="social-links"> <li><a href="https://facebook.com/profileURL" target="_blank"><img src="/wp-content/themes/ThemeNameGoesHere/images/icon/facebook.png"></a></li> <li><a href="https://plus.google.com/profileURL" target="_blank"><img src="/wp-content/themes/ThemeNameGoesHere/images/icon/google-plus.png"></a></li> <li><a href="https://twitter.com/profileURL" target="_blank"><img src="/wp-content/themes/ThemeNameGoesHere/images/icon/twitter.png"></a></li> </ul> 

Шаг 2) Загрузите плагин «Виджеты на страницах» или его эквивалент. Установите и перейдите в настройки Widgets на страницах. Находится в «Настройки»> «Виджеты на страницах». Вставьте имя, которое вы хотите, я буду использовать «социальный раздел». Перейдите в раздел «Виджеты внешнего вида» и добавьте текстовый виджет в наш недавно созданный виджет (социальный раздел) Мы будем использовать это, чтобы изменить меню «на лету» и не иметь статического меню в наших php-файлах тем каждый раз, когда нам нужно добавить социальную сеть.

Шаг 3) Откройте файл, куда вы хотите перейти в меню. Это может варьироваться от темы к теме к теме. Тема, посвященная разработчику, обеспечит перехват темы. , В моем примере будет использоваться привязка темы моих родителей, чтобы вставить меню, которое мы создаем на шаге 1, в нужном месте. Если ваша тема не имеет предопределенных перехватов, вы можете посмотреть в wordpress codex для wp-переключателей по умолчанию.

Шаг 4). Используя дочерние темы functions.php, мы создадим простую функцию, которая вызовет наш виджет на страницах (социальный раздел), которые мы создали на шаге 2.

 function add_social_menu(){ //Custom function that will add our menu when called echo do_shortcode('[widgets_on_pages id="social-section"]') //this will run our widget which will contain our social-links UL } add_filter('below_header_hook','add_social_menu'); //first parameter will be your hook and the second is the function you want to insert 

Шаг 5) Сохраните / загрузите и отредактируйте css для вашей ссылки. Это немного длиннее, но это решение, которое вы можете редактировать в бэкэнд. Если у вас есть какие-либо вопросы по этому методу, пожалуйста, свяжитесь со мной.

Создайте пункты меню для социального меню в вашем случае под названием «social», добавьте в него значение полного имени класса. Примеры: значок твиттера, значок facebook, а затем с помощью css, объявленного в style.css, как показано в следующем коде, присоедините изображения к соответствующему меню Предметы.

 .facebook-icon a{ background: url("facebook-icon.png") no-repeat scroll 0 0 transparent; display: block; font-size: 0; height: 10px; line-height: 0; text-indent: -9999px; width: 10px; }