Дневник Предпринимателя "inDV"
УстановитеFlash player
On-Line Радио от автора Дневника Предпринимателя "inDV" для действующих и начинающих предпринимателей и бизнесменов.

Формат радиостанции: All Talk

Жанры: House, Trap, Dubstep, Drum&Bass

Сейчас в эфире: Загрузка ...

  • Подписаться на статьи

    Введите свой Email-адрес:

    Подписавшись, вы будете получать все новые статьи себе на почту сразу после их публикации.
Рубрики: Интернет-Бизнес | Шаблоны | 26.04.2016 | 16:30 | 236 Просмотров

Бизнес-Шаблон WordPress

Бизнес-Шаблон WordPress

Открыть демонстрацию темы

Скачать тему

Приветствую вас, дорогие друзья, на просторах моего блога! Сегодня я хочу вам представить собственную разработку шаблона для WordPress в синем цвете. Этот шаблон не просто подойдет под любую тематику при его уникализации, но он еще адаптирован под рекламные блоки рекламной сети Google Adsense, кроме того, настройки его настолько просты, что справится даже ребенок, ведь он состоит всего из трех изображений, а остальное оформление создано исключительно языком программирования PHP, но даже это не проблема, ведь инструкция по уникализации уже ждет вас ниже.

Бизнес-Шаблон WordPress

Если вы не обладаете достаточными навыками по оптимизации сайта и отдельных ее страниц, то в данном шаблоне уже все настроено, речь идет, разумеется, о заголовках H1. Остальную информацию по оптимизации сайта и статьи, вы сможете найти в статьях:

  • Как писать статью для сайта?
  • Как оптимизировать сайт?

Инструкция по настройке

Если вы уже настроили свой сайт, у шаблона “Бизнес-Шаблон WordPress” уже имеется название, описание, более того, если он у вас уже оптимизирован, то вам останется выполнить всего два простых действия, чтобы название и описание вывелись в шапке сайта.

Меняем название и описание в шапке сайта

  1. Зайдите в файловый менеджер у себя на хостинге и найдите тему: Theme from Shimolin Pavel 1.0
  2. Путь до темы должен быть таким: ваш_сайт.ru/public_html/wp-content/themes
  3. Откройте ее и зайдите в папку settings
  4. Пропишите название сайта в файле NAME.PHP
  5. Описание сайта пропишите в файле DESCRIPTION.PHP

DESCRIPTION.PHP

Инструкция по вставке рекламных блоков

Не выходя из этой папки, можно вставить в сайт два рекламных блока от Google Adsense двух форматов:

  1. В шапке сайта 728x90px (вставьте код рекламного блока в файл 728-90.php)
  2. В боковой колонке 336x280px (вставьте код рекламного блока в файл 336-280.php)

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

Вставить третий блок рекламы можно в виджетах в административной панели вордпресс.

Инструкция по уникализации

Я почти на 100% уверен в том, что вы захотите немного изменить этот Бизнес-Шаблон WordPress под свою тематику сайта, поэтому предлагаю инструкцию.

В папке IMAGES находится три изображения, AVA – это картинка в форме аватара, находящаяся по левый край шапки сайта, ее размер 200х200px, можете изменить на свое изображение того же размера. BACKGROUND – это фон сайта, если его изменить, изменится весь окрас сайта целиком, а уже под него можно настраивать объекты содержимого и навигации.

Последним и самым важным шагом будет редактирование файла STYLE.CSS, который находится в корне шаблона.

редактирование файла STYLE.CSS

Как я говорил ранее, шаблон нарисован языком php, поэтому я покажу, какая часть кода за что отвечает, чтобы пользователь понимал, что он редактирует, исправляя код.

Возьмем в пример начало кода.

Одним и тем же цветом выделены объекты и описание, а таким цветом выделю то, о чем уже написано или то, что лучше не менять.


/************************************************
* Шапка сайта *
************************************************/

#header
{
background-color: rgba(10, 102, 149, 0.8); (фоновой цвет) RGBA – смотрите изображение; Прозрачность
border-top: 1px solid rgba(114, 167, 194, 0.8); (граница сверху)
border-right: 1px solid rgba(6, 64, 94, 0.8); (граница справа)
border-bottom: 1px solid rgba(4, 43, 63, 0.8); (граница снизу)
border-left: 1px solid rgba(62, 134, 171, 0.8); (граница слева)
border-radius: 10px 10px 10px 10px; (округлости в углу)
width: 976px;
height: 220px;
text-align:left;
margin: 10px 0px 10px 0px;
padding: 0px;
}

Что такое RGB


Верхнее навигационное меню

/************************************************
* Верхнее навигационное меню *
************************************************/

#menu
{
background: linear-gradient(to top, rgba(10, 102, 149, 0.8), rgba(28, 128, 180, 0.8), rgba(10, 102, 149, 0.8)); Линейный градиент, то есть, плавный переход из одного цвета в другой (Как видите, у меня градиент еще и прозрачный) снизу вверх; нижний цвет; средний цвет; верхний цвет
border-top: 1px solid rgba(114, 167, 194, 0.8);
border-right: 1px solid rgba(6, 64, 94, 0.8);
border-bottom: 1px solid rgba(4, 43, 63, 0.8);
border-left: 1px solid rgba(62, 134, 171, 0.8);
border-radius: 10px 10px 10px 10px;
width: 976px;
text-align: left;
margin: 0px 0px 10px 0px;
padding: 0px 0px 0px 0px;
height: 40px;
font-size: 11px;
font-family: Tahoma, Georgia, “Times New Roman”, Times, serif;Шрифты, если у пользователя не установлен первый шрифт, автоматически загружается второй и т.д. по списку.
}


#title
{
background: #0a6695; – тоже цвет, правда, более упрощенной настройки (смотрите изображение ниже)
background: linear-gradient(to top, #1c80b4, #0a6695);
border-top: 1px solid rgba(114, 167, 194, 0.8);
border-right: 1px solid rgba(6, 64, 94, 0.8);
border-bottom: 1px solid rgba(4, 43, 63, 0.8);
border-left: 1px solid rgba(62, 134, 171, 0.8);
border-radius: 5px 5px 0px 0px;
width: 548px;
height: auto;
padding: 7px 10px 7px 10px;
margin: 9px 0px 0px 10px;
color: #e8eff7;
font:11px/15px tahoma, Times new roman, Arial, Helvetica, sans-serif;
font-weight:bold;
text-shadow:#000000 1px 1px 1px;
text-align: justify;
}

Упрощенный вариант кодировки цвета

Остальные объекты настраиваются таким же образом, если вы хотите получать новые шаблоны прямо себе на почту, то подпишитесь в правой боковой колонке, я обязательно еще создам темы для wordpress, публикация будет называться примерно, как эта – Бизнес-Шаблон WordPress

C этой статьей также читают следующие:

Оставить комментарий

Наверх