Перейти к содержимому

Реферальная программа Мегаплана

Партнерская программа Kredov

Переделать горизонтальное меню в вертикальное

#1 badman

badman
  • Пользователь
  • 103 сообщений
  • Репутация: 5
0

Отправлено 03 Май 2013 - 08:27

Сайт http://ctpoika22.ru/ в верхнем меню нужно сделать горизонтальное меню, а не вертикальное как сейчас. Плюс увеличить шрифт и убрать слово "Страницы". Правильно я понимаю, что все эти действия нужно проделывать в style.css? И если да, то какой блок там нужно отыскивать?

Изображение

 

 

  • 0

#2 yury

yury
  • Пользователь
  • 629 сообщений
  • Репутация: 176

Отправлено 03 Май 2013 - 10:55

Нет. Не правильно.

  • Для начала. У вас тема WP, хитро-скроенная в стиле а ля Франкенштейн. Т.е. кто-то над ней долго и со знанием дела издевался, накладывая слои один на другой, в результате страница сайта рисует массу всякой информации, которую посетитель не увидит, потому что она перекрыта другой информацией.

    Т.е. к примеру, на страницу выводятся блок с поиском, блок с меню, еще куча блоков с классом "site-description". Большую часть из них не видно.

    Один из блоков "site-description" (из тех что видны, т.е. не перекрыты другими) содержит тот самый список:
    <div class="site-description"><h2 class="widgettitle">Страницы</h2>
    <ul>
    <li class="page_item page-item-167"><a href="http://ctpoika22.ru/kontakty/">Контакты</a></li>
    <li class="page_item page-item-156"><a href="http://ctpoika22.ru/price/">Прайс</a></li>
    </ul>
    </div>
  • Отсюда вывод: чтобы сделать меню на сайте можно
    1) Либо воспользоваться этим списком, стилизовав его. Т.е. дать ему id или class (это делается в html-файле, в случае с WP не уверен, где оно там точно живет ибо не влезал туда) и описать их в стилях (это делается в css-файле).
    2) Либо воспользоваться уже существующим блоком меню:
    <div class="menu">
    <ul id="menu-top-menu" class="">
    <li id="menu-item-19" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-19"><a title="ctpoika22" href="http://ctpoika22.ru/">Главная</a></li>
    <li id="menu-item-170" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-170"><a href="http://ctpoika22.ru/kontakty/">Контакты</a></li>
    <li id="menu-item-171" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-171"><a href="http://ctpoika22.ru/price/">Прайс</a></li>
    </ul>
    </div>
    , как-то вытащив его из под наслоений других блоков, а затем и уже править его стили в вашем http://ctpoika22.ru/...sight/style.css Благо там какие-то стили для этого блока уже есть (хотя они для вертикального варианта меню и под горизонтальный их переделывать надо будет):
    .menu {width: 100px; padding-right: 30px; float: right;}
    .menu ul {margin-top: 35px;}
    .menu li {font-size: 11px; text-transform: uppercase; margin: 6px 0;}
    .menu a {color: #000; text-decoration: none;}
    .menu a:hover {text-decoration: underline;}

  • 0

#3 isvetlichniy

isvetlichniy
  • Пользователь
  • 619 сообщений
  • Репутация: 93

Отправлено 03 Май 2013 - 14:37

Отсюда вывод: чтобы сделать меню на сайте можно


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

1. чтобы убрать строчку "Страницы"
.site-description .widgettitle {
display: none;
}

ну а для меню сделать вот что
.site-description ul li{
float: left;
padding: 0 10px;
display: block;
}

.site-description ul li a{
font-size: 14px;
}

этого должно хватить
P.S. Мой способ позволит избежать редактирования структуры шаблона, я не думаю что ТС это будет под силу
P.P.S. Шаблон действительно через одно место сделан, рекомендую автору поудалять неиспользуемые виджеты, типа поиск, архивы и т.д.
  • 0

#4 yury

yury
  • Пользователь
  • 629 сообщений
  • Репутация: 176

Отправлено 03 Май 2013 - 14:56

чего то ты намудрил и уже хочешь изобретать велосипед.

Где вы увидели мудрость и велосипед?

То что вы написали — тоже самое, что у меня в первом пункте ("воспользоваться этим списком, стилизовав его"). Только с готовым решением, которое учитывает тот факт, что все прочие блоки "site-description" перекрыты другой инфой. Потому и можно этот класс использовать для оформления меню. Проблемы могут возникнуть лишь, если потом таки возникнет желание этими виджетами воспользоваться.

А второй пункт я привел, как более правильный с точки зрения семантики и здравого смысла: там под меню отряжается не виджет, а уже существующий на сайте блок под названием "menu".
  • 1

#5 isvetlichniy

isvetlichniy
  • Пользователь
  • 619 сообщений
  • Репутация: 93

Отправлено 03 Май 2013 - 15:03

там под меню отряжается не виджет, а уже существующий на сайте блок под названием "menu"

это однозначно будет правильней, но...

кстати, я так и не понял почему автор меню делает с помощью виджета
  • 1

#6 badman

badman
    Topic Starter
  • Пользователь
  • 103 сообщений
  • Репутация: 5

Отправлено 04 Май 2013 - 07:17

Спасибо, помогло)

isvetlichniy, Это чем-то чревато?


  • 0

#7 isvetlichniy

isvetlichniy
  • Пользователь
  • 619 сообщений
  • Репутация: 93

Отправлено 04 Май 2013 - 17:10

нет, просто смысл какой? ворпресс обладает хорошим функционалом для создания меню.
почитай вот


  • 0


Оформление форума – IPBSkins.ru