Автор Тема: Веб-дизайн  (Прочитано 1314 раз)

0 Пользователей и 1 Гость просматривают эту тему.

Оффлайн Kanzeron Автор темы

  • Ветеран форума
  • ******
  • Сообщений: 4444
Веб-дизайн
« : Сентября 07, 2014, 19:32:54 »
В общем, специализированная темка для тех, кто в теме. Есть несколько вопросов к знающим людям.

Делаю сайт на Вордпрессе. Сделал шаблон в Artisteer. В самом Артистире сайт выглядит хорошо, но Вордпресс этот шаблон обрабатывает не совсем корректно.
Конкретно есть 2 проблемы.
1. Неправильное отображение шрифта заголовка статьи. Хоть в css на Вордпрессе стоит значение font-variant:small-caps, выглядит шрифт некрасиво, в артистире много лучше. Вот картинки:
В Artesteer:
(нажмите чтобы показать/спрятать)
В Wordpress:
(нажмите чтобы показать/спрятать)

2. Отступ текста надписей published и posted - его надо увеличить, сделать наравне с основным текстом.
(нажмите чтобы показать/спрятать)

CSS-файл могу скинуть.

Оффлайн Voldemort

  • Завсегдатай
  • ***
  • Сообщений: 298
  • GuitarPlayer.Ru fan!
Re: Веб-дизайн
« Ответ #1 : Сентября 07, 2014, 20:28:00 »
Я не пользуюсь Артистиром, поэтому не знаю, он внедряет нужный шрифт? Ну обычно это делается с помощью @font-face.
А за отступы в css отвечает margin или padding (поля), например, margin-left: 20px.
Чтобы найти какая строка в css, встаете мышкой на нужное слово и нажимаете правую кнопку мыши и Просмотр кода элемента. В Хроме по крайней мере так.
« Последнее редактирование: Сентября 07, 2014, 20:33:14 от Voldemort »

Оффлайн Rock Lobster

  • Эксперт
  • *****
  • Сообщений: 2449
  • Ты с собою заберешь, только добрые дела.
Re: Веб-дизайн
« Ответ #2 : Сентября 07, 2014, 21:37:29 »
В хроме есть режим разработчика, как сказал Voldemort. Многие проблемы можно там отследить. F12, а там посмотреть как взаимодействуют стили. Может у font-variant:small-caps приоритет низкий и надо приписать !important.

... и добавил:

Да и от font-variant:small-caps не зависит как выглядит шрифт особо, размер букв вроде меняет незначительно кроме заглавных.
« Последнее редактирование: Сентября 07, 2014, 21:42:32 от Rock Lobster »

Оффлайн Dying Fetus

  • Живу на форуме
  • *******
  • Сообщений: 10261
  • DIYng Fetus
    • http://cathar.ru
Re: Веб-дизайн
« Ответ #3 : Сентября 08, 2014, 01:27:45 »
Kanzeron,
1) letter space уменьшай
2) margin-bottom: *px;

Оффлайн Rock Lobster

  • Эксперт
  • *****
  • Сообщений: 2449
  • Ты с собою заберешь, только добрые дела.
Re: Веб-дизайн
« Ответ #4 : Сентября 08, 2014, 03:22:23 »
letter-spacing там ничего не даст ведь ???

... и добавил:

Если что гони код, мы тут напозорим его позором оффтопа и все заработает :pozor:
« Последнее редактирование: Сентября 08, 2014, 03:23:58 от Rock Lobster »

Оффлайн Dying Fetus

  • Живу на форуме
  • *******
  • Сообщений: 10261
  • DIYng Fetus
    • http://cathar.ru
Re: Веб-дизайн
« Ответ #5 : Сентября 08, 2014, 08:12:27 »
Rock Lobster, даст по идее, на второй картинке он больше, а так, там похожэ на то, что шрифт жырнее  ???

Оффлайн Kanzeron Автор темы

  • Ветеран форума
  • ******
  • Сообщений: 4444
Re: Веб-дизайн
« Ответ #6 : Сентября 08, 2014, 18:01:31 »
1) letter space уменьшай
Нет, не помогает. Здесь само написание другое.

2) margin-bottom: *px;
Я не знаю, к какому элементу кода применять это.  :pozor:

... и добавил:

я вот что ещё заметил - шрифт в вордпрессе на всём сайте вышлядит по-другому, не только в заголовке статьи.



« Последнее редактирование: Сентября 08, 2014, 18:11:45 от Kanzeron »

Оффлайн Voldemort

  • Завсегдатай
  • ***
  • Сообщений: 298
  • GuitarPlayer.Ru fan!
Re: Веб-дизайн
« Ответ #7 : Сентября 08, 2014, 18:29:47 »
Я же вроде ответил на оба вопроса в первом посте? Если уровень знаний совсем уж начальный, может стоило выбрать готовую тему на сайте вордресс.орг, коих миллион?

Оффлайн Kanzeron Автор темы

  • Ветеран форума
  • ******
  • Сообщений: 4444
Re: Веб-дизайн
« Ответ #8 : Сентября 08, 2014, 19:12:28 »
Я же вроде ответил на оба вопроса в первом посте? Если уровень знаний совсем уж начальный, может стоило выбрать готовую тему на сайте вордресс.орг, коих миллион?
Готовая тема не подходит по дизайну.
Ваш метод не подходит. У меня файрфокс, он не указывает на конкретную строку в css.
Если есть в инете инфа, какая строка за что отвечает в вордпрессе, буду призназнателен.

Оффлайн Voldemort

  • Завсегдатай
  • ***
  • Сообщений: 298
  • GuitarPlayer.Ru fan!
Re: Веб-дизайн
« Ответ #9 : Сентября 08, 2014, 20:30:45 »
Готовая тема не подходит по дизайну.
Ваш метод не подходит. У меня файрфокс, он не указывает на конкретную строку в css.
Если есть в инете инфа, какая строка за что отвечает в вордпрессе, буду призназнателен.

Это не так просто. В файле css может быть больше 1000 строк, в зависимости от сложности. Например,
h1 {
   font-family: 'Droid Sans', sans-serif;
   font-weight: 400;
   line-height:1.0em;
   color: #00387e;
   font-size: 24px;
   margin-top: 6px;
   margin-bottom: 12px;
}
Это только маленький кусочек кусочек описания одного заголовка h1, без подсветки и т.д. Видите, тут основной текст указан Droid Sans, но т.к. ни у какого нормального человека в компе такой шрифт скорее всего не будет установлен, дальше прописан запасной шрифт - обычный sans-serif, который есть на каждом компе. В итоге, если вы не внедрите шрифт Droid на свой сайт, все люди будут видеть шрифт sans-serif, который будет "не очень похож". А если вы не пропишете запасной шрифт, то вместо Droid подставится вообще непонятно что, Arial например. Дальше вот отступы указаны сверху и снизу.

Если у вас сайт уже опубликован, пришлите тогда ссылку на сайт. Может и так разберемся.

Оффлайн Kanzeron Автор темы

  • Ветеран форума
  • ******
  • Сообщений: 4444
Re: Веб-дизайн
« Ответ #10 : Сентября 08, 2014, 20:50:04 »
Voldemort, У меня основной шрифт - Palatino Linotype. Он довольно распространён, в каждой винде установлен. Про сложность это точно - методом тыка пытался менять всё, что связано с header - мало что меняется.
Сайт установлен на локальном сервере, к сожалению. Могу выложить файл CSS

Оффлайн Pavel WOC

  • Эксперт
  • *****
  • Сообщений: 2789
  • GuitarPlayer.Ru fan!
    • World Of Covers
Re: Веб-дизайн
« Ответ #11 : Сентября 08, 2014, 20:55:59 »
Разные шрифты могут быть из за того, что для body в шаблоне вообще не прописан шрифт. Браузер это видит и ставит свой "по умолчанию".
Лечится принудительно прописыванием нужного шрифта для элемента body.

Цитировать
Если есть в инете инфа, какая строка за что отвечает в вордпрессе, буду призназнателен.
дык невижу проблемы просто "правая кнопка мыши -> исходный код" и там уже соориентироваться по тексту, который выводится на страницу. Ну и смотришь какое там имя класса у элемента div. Затем находишь этот класс в файле css и редактируешь.

Либо просто скопируй этот код в фаил и тоже сюда скинь.
« Последнее редактирование: Сентября 08, 2014, 20:59:12 от Pavel WOC »

Оффлайн Kanzeron Автор темы

  • Ветеран форума
  • ******
  • Сообщений: 4444
Re: Веб-дизайн
« Ответ #12 : Сентября 08, 2014, 21:19:25 »
Разные шрифты могут быть из за того, что для body в шаблоне вообще не прописан шрифт. Браузер это видит и ставит свой "по умолчанию".
Лечится принудительно прописыванием нужного шрифта для элемента body.
дык невижу проблемы просто "правая кнопка мыши -> исходный код" и там уже соориентироваться по тексту, который выводится на страницу. Ну и смотришь какое там имя класса у элемента div. Затем находишь этот класс в файле css и редактируешь.

Либо просто скопируй этот код в фаил и тоже сюда скинь.
Походу, вот код

.art-postheader a:link {
    font-size: 24px;
    font-family: "Palatino Linotype",Georgia,"Times New Roman",Times,serif;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    text-transform: none;
    font-variant: small-caps;
    text-align: left;
    color: #FFF;

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

Оффлайн Pavel WOC

  • Эксперт
  • *****
  • Сообщений: 2789
  • GuitarPlayer.Ru fan!
    • World Of Covers
Re: Веб-дизайн
« Ответ #13 : Сентября 08, 2014, 21:32:22 »
Это класс для ссылок, которые не посещались ещё... действует только на ссылки, которые находятся в блоке чей класс "art-postheader".
Лучше скинь полный html код который получается "правая кнопка мыши -> исходный код" в браузере.

Оффлайн Voldemort

  • Завсегдатай
  • ***
  • Сообщений: 298
  • GuitarPlayer.Ru fan!
Re: Веб-дизайн
« Ответ #14 : Сентября 09, 2014, 11:51:00 »
Да, без конкретного места трудно искать - css огромный же. :) Но у меня мысль появилась - похоже, что просто в вордпрессе тень не отображается: text-shadow которая.