Домашняя » WordPress » Создание виджета боковой панели «Обо мне» с помощью редактора сообщений [Учебник по WordPress]

    Создание виджета боковой панели «Обо мне» с помощью редактора сообщений [Учебник по WordPress]

    Большие блоги прекрасно используют страницы «Обо мне». Чтобы привлечь туда пользователей, в 99% случаев они размещают краткую интригующую статью «Обо мне» на боковой панели блога. В этом посте я покажу вам, как создать этот раздел. Это так же просто, как написать новый пост. Фактически, мы будем использовать новый редактор сообщений в WordPress для создания этого.

    Почтовый редактор - один из самых универсальных инструментов в WordPress, и вряд ли кто-то знает об этом. То, что я собираюсь показать вам, это хитрый маленький дизайнерский взлом, хитрость, настолько упущенная из виду, что она даже не попала в список 40 WordPress Hacks на сайте Hongkiat.com..

    Этот трюк также отлично подходит для изучения некоторых основных HTML и CSS, если вы только начинаете.

    Создайте ваше сообщение

    Все, что вам нужно для этого урока, это ваша страница "Обо мне", ваша фотография и текст. Ваша страница "Обо мне" должна быть сосредоточена на ваших достижениях в ведении блога, задавать читателю некоторые вопросы и включать фотографии ваших блогов. Уже сделали эту страницу? Отлично.

    Теперь мы собираемся взять все это на WordPress новый редактор постов. Откройте его и загрузите свое изображение. Мы будем делать большую часть этого из Вкладка HTML. Когда вы загружаете изображение, WordPress автоматически генерирует для него HTML-код. Перейдите на вкладку HTML и создайте пробел (нажмите ввод) над изображением. Затем напишите здесь небольшое сообщение, что-то вроде «Кто за этим сайтом?» или даже просто «обо мне». Будь креативным.

    Добавьте краткое описание из 3-4 предложений, которое заинтриговало читателя. В конце этого текстового блока напишите предложение типа «Узнайте больше здесь» и дайте ссылку на свою актуальную страницу «О компании»..

    Стиль вашего сообщения

    Теперь иди Визуальная вкладка. Сосредоточьте свой текст. Когда вы вернетесь к HTML, вы заметите, что WordPress написал для вас некоторый код в форме «p-стиля». В этом прелесть создания виджетов в новом редакторе сообщений; WordPress авто-коды для вас! Затем вы просто добавляете базовый CSS!

    Создайте что-то вроде этого:

    ТВОЕ СООБЩЕНИЕ

    Обязательно закройте стиль p с помощью

    .

    И добавьте любой другой CSS, который вам может понадобиться. Не знаете CSS? Просто поищите в Google «CSS-код для ____» и в пустом месте укажите, что вы пытаетесь сделать. Затем скопируйте и вставьте стиль p. Поместите это вокруг своего текстового сообщения блока ниже изображения. Украсьте его так, как вам нравится, и закройте его. Если вы забудете закрыть стиль p, это не страшно. Стили будут применяться к большему количеству текста, который вы хотите, но все делают эту ошибку хотя бы один раз.

    Используйте коды выделить курсивом и выделите текст и не забудьте закрыть его.

    Мы закончили создавать, на данный момент, и пришло время для веселья, чтобы начать.

    Поместите свою работу в боковую панель

    На вкладке HTML скопируйте и вставьте все, что вы создали. Перейти к Внешний вид, вкладка Виджеты, и перетащите пустой текстовый виджет в вашу боковую панель. Вставьте в свой код. Затем нажмите «Сохранить» и перейдите на домашнюю страницу блога. Как это выглядит?

    Вы почти наверняка захотите внести некоторые изменения здесь. Изображение может не соответствовать размеру, или шрифты могут не отображаться так, как вы себе представляли, но не беспокоиться, вы можете отредактировать все это прямо в виджете «Текст» или, что еще лучше, в своем новом редакторе постов, где вы можете просмотреть изменения легче.

    Fun Styling Особенности и другие дополнения

    CSS действительно забавная игра. Вот несколько способов сделать этот раздел обо мне действительно популярным.

    1. Используйте экзотические цвета.
    2. Используйте пунктирную или цветную рамку.
    3. Поместите форму «Зарегистрироваться» прямо под вашим текстом. Я использую Aweber для этих.
    4. Добавьте ссылки на места, где была представлена ​​ваша работа.
    5. Брось в шутку или будь таинственным.

    Видеоурок

    Вы также можете посмотреть видеоурок к этому посту, как показано ниже или на YouTube..

    Что дальше?

    Теперь, когда у вас есть основной раздел «Обо мне» и страница «Обо мне», перейдите к другим блогам, чтобы узнать, какие стратегии и схемы работают для них. Сделайте несколько заметок. Затем проведите еще какое-то исследование ваших собственных читателей..

    Приспособьте свой «Обо мне» именно к тому, что хотят ваши читатели, и вы в конечном итоге начнете видеть больше читателей, комментаторов и постоянных подписчиков. Поставьте себя на боковую панель, и это стоит того.

    Примечание редактора: Этот пост написан Грег Нараян для Hongkiat.com. Грег - 25-летний парень из Нью-Йорка, который отвечает на 150 вопросов блога перед завтраком.

    © Savtec
    Полезная информация и советы по веб-разработке. Программирование, веб-дизайн, CSS, HTML, JAVASCRIPT. Настройка и переустановка WINDOWS. Создание сайтов и приложений с нуля.