Владимир Вокстермен

Здравствуйте! Все уже пришли в себя после матча «БАТЭ-Барселона»? Для тех, кто не в курсе, каталонцы вкатили нашим целых пять мечей. Действие матча проходило под проливным «скользким» дождем, что не помешало Месси огорчить нашего вратаря дважды. Были еще Педро Родригеc, в концовке матча отличился Давид Вилья, а первый гол уже на 19-ой минуте забил Володько, правда в свои ворота. Весь матч в штрафной скучал Вальдес, вратарь «Барсы» и очень хотелось, чтобы наши ребята помогли ему согреться. Но Виктор скучал… А один беллорусский болельщик от скуки даже выскочил на поле, совсем мирный, совсем пьяный.

батэ-барселона фанат на поле

Что-то я отвлекся. Наша цель — сделать блоги и сайты как можно более привлекательными. Другими словами, мы делаем «сайт для людей». А красивые элементы дизайна будут плюсом. Такие, например, как ролловеры(это меняющаяся картинка при наведении курсора). Итак, начнем.

Переходим в папку с  темами wordpress. Где находится папка с темой вордпресс?  Здесь: http://ваш_сайт.рф/public_html/wp-content/themes/). Выбираем нашу тему и ищем файл style.css. Ближе к началу темы вставляем следующий код:

Рисуем картинку такого вида:

ролловеры и wordpress

Ширина этой картинки 145px, высота —  128px(это вдвое больше нашего значения в коде). Получается, что 64px приходится на серый TIZZYSTORE и 64px приходится на красный. Ширину и высоту вы можете задать свою.

Решаем, куда rollover будем вставлять. Вот код вставки:

Мне его необходимо было вставить в шапку темы(header.php) вместо текстового названия сайта. В тоже время, я хотел, чтобы при нажатии на картинку пользователь сайта перемещался на главную страницу сайта. Для этого мне  понадобился следующий код:

Вот и все… А нет, не все, результат вы можете увидеть на сайте мультибрендовой одежды TIZZYSTORE или прямо здесь в «Блоге альтруиста», нажав на любой элемент шапки сайта.

Подписывайтесь на обновления сайта, ставьте «мне нравится», делайте retwee…ну, вы знаете, вообщем. Успехов.

Поставьте оценку автору!

Для меня это невероятно важно, а у вас займёт всего лишь один клик.

УжасноПлохоСреднеХорошоОлтично! (1 оценок)
Загрузка...
11 Комментариев
  1. midhul
    06.12.2015 at 23:15

    Random Image Load with image specific hovers (rollovers)/случайная картинка при наведении курсора мыши скрипт/

    ===

    function randomPick (arr) {

    var selected = arr[Math.floor(Math.random()*arr.length)]

    return selected;

    }

    images =

    [

    «image1.png»,

    «image2.png»,

    «image3.png»,

    «image4.png»,

    «image5.png»

    ]

    function randomHover () {

    var myImage = document.getElementById (‘hover’);

    var selImage = randomPick (images);

    myImage.src = selImage;

    }

    function resetState () {

    var myImage = document.getElementById (‘hover’);

    myImage.src = «something.png»;

    }

    ===

    Отсюда http://www.dynamicdrive.com/forums/showthread.php?62641-Random-Image-Load-with-image-specific-hovers-%28rollovers%29

    • ushi
      10.12.2015 at 02:11

      Хорошо, но сложно для новичка.

  2. Анна
    11.03.2013 at 23:12

    Эх, БАТЭ, БАТЭ! Жаль Брессана лишились. А ролловеры – штука прикольная!

    • ushi
      16.03.2013 at 16:12

      Анна, Вы меня приятно удивляете: так следить за трансферным рынком БАТЭ — достойно уважения.

  3. Максим
    12.02.2013 at 17:51

    Это был крутой,матч,неплохо наших расскатали,хотя и обидно очень было,посмотрим как Зенит сыграет)

    • ushi
      13.02.2013 at 17:16

      Это был мокрый матч? но по счету — сухой.)

  4. valencianka
    24.04.2012 at 02:56

    Попробую использовать,не знаю,что получиться.Если не сумею,то придется задавать вопросы

  5. ASFOUR
    04.03.2012 at 00:51

    а вы отвечаете на комментарии на blogalt.ru или просто их удаляете?

    • ushi
      04.03.2012 at 11:49

      На ваш не только ответил, но еще и удалил ссылку из него. Так, для первого раза:)

  6. ushi
    30.01.2012 at 10:51

    Картинку-кнопку можно добавить в любой файл темы: хотите в сайдбар, хотите в футер (тогда код кнопки добавляем в файлы sidebar.php и footer.php соответсвенно).

  7. Сергей
    СергейОтветить
    27.01.2012 at 17:36

    Всё хорошо, всё работает, лишь один вопрос — как добавить ссылку к такой кнопке на странице блога, а не в шапке темы?

Добавить комментарий

Ваше сообщение*

Имя*
Email*
Сайт