Заметки на полях

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



Вот примерно так это будет выглядеть в сообщении. Посмотрите налево.

Рекомендую к прочтению статью стили css в шаблоне блога.
Реализуем это с помощью совсем небольшого кода CSS и HTML.

<style>.stiker {
  font: normal normal 100% Georgia, Times, serif;
  color: #1A4676; /цвет текста/
  width:170px; /ширина стикера/
  float:left; /расположение слева/
  position:absolute;
  margin-left:-180px; /выравнивание относительно левого края/
  text-align:center;
}</style>

<div class="stiker">
Рекомендую к прочтению статью
<a href="http://www.shpargalochki.ru/2014/04/stili-css-v-shablon-bloga.html#more">стили css в шаблоне блога</a></div>

Если в коде CSS добавить стиль рамки, допустим, border: 2px solid blue;, то вид нашего стикера будет, как на картинке выше. Соответственно, изменив сам текст заметки. Я выделила его синим цветом.

Код устанавливается при написании сообщения. В том месте, где эту сноску хотим видеть. Перейдите из режима создать в режим HTML и вставьте его.

Если предполагаете его неоднократное использование, то код CSS лучше вставить в шаблоне блога. Вкладка шаблон-изменить HTML. Найдите строку ]]></b:skin> и сразу над ней установите его. При этом необходимо лишь убрать открывающийся и закрывающийся теги <style>...</style>.Потом при желании вывести заметку на полях просто добавляем код HTML.

Вот такая небольшая интересная примочка появиться на полях вашего сообщения.
А у меня сегодня всё. Спасибо, что читаете мои шпаргалки. До новых встреч.

Ой, а что это там ниже? Ну надо же! Нажимаем!

оформите подписку на новые шпаргалки

Введите Ваш email


11 комментариев:

  1. Вика, привет. Я не по теме. Что это случилось, комментаторы перечеркнуты, а к тебе зашла, так и ярлыки зачеркнутые и последние комментарии. Или это только у меня?

    ОтветитьУдалить
  2. Привет, Олеся. Я нормально вижу у себя. Сейчас загляну к тебе.

    ОтветитьУдалить
  3. У тебя тоже всё ОК. Что-то у тебя.

    ОтветитьУдалить
    Ответы
    1. Спасибо, Вика, что посмотрела. Я установила в хроме какой-то RDS bar, так мне посоветовали исправить проблему с переводчиком (он не предлагает переводить), теперь такой эффект. Кстати, переводчик так и не заработал.)

      Удалить
    2. Хорошо, что всё решилось.

      Удалить
  4. Олеся, может Вы уже разобрались с проблемой и мое сообщение запоздало... Скорее всего Вы установили SEOguake- он все активные ссылки таким образом выделяет - перечеркивает. У меня точно такой же эффект получился.

    ОтветитьУдалить
    Ответы
    1. Ирина, спасибо за комментарий. По-моему Олеся разобралась уже в проблеме. Ссылки могут быть перечёркнуты не только из-за Сеоквэйк.Возможно и другие расширения или плагины. У меня Nofollow eyes тоже подобным образом себя ведёт. Я его, правда включаю по мере необходимости.

      Удалить
    2. да, вы правы, наверняка разобралась. Вика, который день гуляю по вашему блогу. все так интересно и ПОНЯТНО! я как та сорока - и это хочется и это))))) если Вас не затруднит, не посмотрите на мой блог? я учитель и мой блог - http://topchiyirina.blogspot.com/ - образовательный, для коллег, учителей и их родителей. хочется услышать мнение специалиста. меня интересует только совет по дизайну - не перестаралась ли я с украшательством? интуиция подсказывает - надо остановиться, а хочется еще)))))

      Удалить
    3. Ирина, через это проходят все. Тут и правда, главное не перестараться. Обязательно сегодня посмотрю.

      Удалить
  5. БОЛЬШОЕ СПАСИБО ВАМ, ВИКА, за советы и замечания!

    ОтветитьУдалить
    Ответы
    1. Ирина, удачи Вам . Спасибо за спасибо.

      Удалить

Пользовательский поиск