Skip to content

 

Изменение HTML-кода на сайте

Очень часто при вставке на страницы сайта или блога логотипов, баннеров, видео и других изображений в виде html-кода, они не вписываются в габариты пространства, куда вы их вставляете. Мне часто попадаются сайты, когда изображение выходит за размеры страницы и выглядит не привлекательно. Например, вот так:

Я не программист и не веб-дизайнер, но вопросы красивого оформления сайта интересуют. И не всегда есть у кого спросить. Вот я и стала сама разбираться, как это можно исправить. Как всегда методом научного тыка. Первый раз я просто уставилась на код, который хотелось подправить и смотрела на него, как баран на новые ворота "Нитево не понимаю!" 🙂

После долгого смотрения разглядела циферки, которые по моему разумению должны означать размеры этого html-кода. Пару раз я их меняла, пока изображение не вписалось в размеры сайдбара.

Например, часто я вижу торчащую форму подписки. Берем сгенерированный код и вставляем его в нужно место. Просматриваем, как он встал. Если вылез за рамки приличия, идем в виджет и подгоняем по размерам.

Красным выделены параметры высоты и ширины. Вот эти цифры и редактируете. Заодно английский текст заменяете русским. Если какой-то текст на ваш взгляд лишний в изображении, удалите.

Бывают изображения с одним числовым параметром, а бывает вообще без размеров. Ну, одно значение изменить ещё легче. А как быть, когда в коде не отображаются размеры? Или вы хотите сами сгенерировать html-код изображения и вставить в виджет или в другое место. Тоже ничего сложного.

Открываете Создать новую запись и вставляете туда нужную картинку или видео, скачав с компьютера или по url-ссылке. По умолчанию новая запись создаётся в визуальном редакторе. Переходите на вкладку HTML и видите вместо изображения текст. Копируете его и вставляете, куда вам надо. Подгоняете по размеру. Если необходимо, центрируете, подставив в начале кода тэг <center>, а в конце </center>.

Всё. Любуетесь своей работой 🙂

23 комментария

  1. AnnaMariaSlavi:

    очень полезная информация — спасибо!

  2. AnnaMariaSlavi:

    Уважаемая Ольга!

    Мы с Вами учились на тренинге START UP.
    11 августа с Ходченковым и А.Евстегнеевым будет проведен бесплатный вебинар «Как всего за 5 вечеров создать и раскрутить свой бизнес». В предстоящем вебинаре я соведущая — mediterranean-export.ru.
    Приходите!

    С уважением,

    Анна-Мария Слави

  3. Ольга:

    Мария, спасибо за приглашение. Я также оставила комментарий на Вашем сайте.

  4. Зули:

    Здравствуйте,Ольга! А нет ли у Вас статьи, объясняющей как можно изменить фон сайта, или,вернее вокруг сайта, если я правильно выражаюсь. У меня он серый, а хочется чего-то светлого. Спасибо!

  5. Ольга:

    А Вы в настройках темы смотрели? Если там ничего нет, тогда надо смотреть хтмл-коды в разделе Дизайн-Редактор-редактирование файлов «темы». Надо заранее знать код того цвета, который Вы хотите установить. Может лучше тему поменять?

  6. Александр:

    Здравствуйте Ольга!Не могли бы Вы рассказать как делать ссылки.Я учусь в старт ап и пока ничего не умею.Спасибо.

  7. Ольга:

    Александр, здравствуйте. Подождите немного, я отвечу на Ваш вопрос в посте.

  8. Ольга:

    Александр, читайте статью http://abramo8a.ru/2011/08/dizain-saita/

  9. Александр:

    Спасибо огромное,Ольга,Вы мне помогли,хотя мне пока еще трудно разобраться.

  10. Ольга:

    Александр, всё постепенно. Сделайте шапку блога поуже, примерно 300 px. И в шапке же должно быть название блога. Это необходимо для поисковых машин. Картинка занимает много полезного места, не давая никакой информации. Поисковики будуь проходить мимо вашего блога, т.к информация для них недоступна. И где Ваш аватар? Вы регистрировались в Граватаре?

  11. Борисова Зинаида:

    Ольга,это опять я.Можно задать вам несколько вопросов?На моем сайте в шапке справа вверху 20 меняющихся фото.Можно ли их заменить на свои фото?Может,это тоже из рода html-кода?
    Еще вопрос:вы обращались в техническую поддержку школы?У меня с этим проблема.После составления вопроса появляется надпись «неверная комбинация email-пароль».А какой пароль писать?Я пишу свой email и пароль от него же.Что я делаю неправильно?Не могу даже обратиться в службу поддержки!!!Хоть плачь!!!

    • Ольга:

      Зинаида, я не увидела Ваши сменяющиеся фото. Вижу только один неподвижный цветок. В шапку можно вставлять любые картинки. Можно вообще без картинок, только надписи.
      А Вы регистрировались в тех. поддержке?

    • Ольга:

      Разобралась с Вашими картинками. По ним щелкать надо 🙂
      всё равно можно и нужно удалить. Можно и тему поменять. Выбрать пошире и поинтересней, например F2. Или откорректировать размер баннера, чтобы не вылазил за границы.

  12. Виктор Велько:

    Оччень-и-оччень полезная информация!
    Если что — можно обращаться за советом?

    • Ольга:

      Да, пожалуйста.

  13. Александр:

    Доброго времени суток,Ольга.Спасибо Вам огромное,у Вас я почерпнул очень много полезной и очень ценной информации. Скажите,Ольга,аватар действительно нужен,и зачем? И как работать с шапкой?

    • Ольга:

      Александр, граватар нужен, если Вы не хотите оставлять комментарии инкогнито. Ведь платформ для блогов много и не везде у Вас есть блог.
      Что значит работать с шапкой? Почитайте мою статью Вставка картинки в шапку блога . Если будет не понятно, пишите.

  14. Александр:

    Здравстуйте Ольга. Спасибо за советы, Ваши советы очень мне помогли! Но вопроссы не заканчиваются. Сейчас хочу сделать второй сайт на совершенно другую тематику. У Вас два сайта, Ольга, подскажите, пожалуйста,что для этого нужно: еще раз зарегистрироваться на таймвеб, соответственно, завести новый емейл, или это лишнее? Заранее благодарю

    • Ольга:

      Здравствуйте, Александр,
      У меня первый блог бесплатный на платформе Blogger. Пока я думала, как его перенести на платный хостинг в WordPress, попала в школу Start Up. Тогда я не стала трогать блог, а создала новый платный. В Блоггере можно оплатить домен 600 руб. в год, я думаю этого достаточно. И там очень много функций по настройкам. Ознакомьтесь с ним поближе, может это то, что Вам надо? Посмотрите как мой устроен http://mlmvsem.blogspot.com/. Или на своем хостинге создайте. Вы можете создать до 5 сайтов. Оплатите только домен, кажется 150 руб. в год.

  15. Александр:

    Создал новый домен на своем хостинге, теперь жду регистрацию. Спасибо Вам за совет, все получается так, как Вы говорите.

    • Ольга:

      Александр, рада была помочь 🙂

  16. Никита:

    Да, Вы правы, подгонять часто приходится, учитывая что большинство бесплатных тем для WordPress очень кривые и косые. Впрочем и платные иногда заставляют лезть в код — не всегда плагины делают все что необходимо автоматически после активации. Базовые знания HTML тэгов (а лучше вместе с CSS и PHP) все таки должны быть у вебмастеров, как ни крути.

    • Ольга Абрамова:

      Да, и я планирую этому учиться, чтобы не на глазок делать, а со знанием дела 🙂