Вставить код HTML, публикуемый в сообщениях.
В этой статье я предложу вам три способа ввода кода, которые вы можете дополнительно настроить, изменяя параметры.
Вставить код HTML, в сообщения
Недавно в комментарии меня спросили, какую систему я использую для публикации HTML и других языков программирования в постах. В течение последнего времени можно публиковать HTML-код в сообщениях Blogger, не интерпретируя его как таковой, но рассматривая его только как текст. Это пока невозможно для комментариев, где код все еще интерпретируется, и чтобы опубликовать его, мы должны использовать хитрость.Даже пользователи Open Live Writer могут легко вставить HTML-код в сообщения, созданные с помощью этого инструмента. Некоторые пользователи Blogger используют цитату или блочную цитату,чтобы опубликовать код, чтобы представить его графически отличным от другого содержимого. Среди прочего, цитата из Blogger можно настроить. Но есть сайты, которые используют цитату для других событий, такие как литературные блоги.
Это я использую в качестве основы для стиля в этом блоге.
1. После сохранения резервной копии шаблона перейдите в Тема -> Изменить HTML и найдите строку <b:skin>. Вы нажимаете на черную стрелку слева, чтобы показать весь код. Нажмите Ctrl + F, вставьте ]]></b:skin> в окно поиска и сразу над ним, вставьте
.codice1 { margin : 15px 35px 15px 15px; padding : 10px; clear : both; list-style-type : none; background : #f9f9f9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHlFMEkRBVb7a7Hbsn9zRWkJParo5EN6y2tBVKB0Q0mD6R5AjPLvl5tJSe_sImJt9tEP2KcAQATEQnU0l-AppuiOfo-svWoW3UjwgnafsMo9VC3jHwD5bjtBzqYcvVOqOzsGIdUZ3SYmI/s720/codice-1.gif) no-repeat right bottom; border : 2px solid #eee; color : #7D7D7D; }
Сохраните шаблон
2. Если вы хотите опубликовать код в посте, созданный в Редакторе Blogger то вы переходите в HTML на странице сообщения и между строк в нужном вам месте вставляете код
<div class='codice1'>
Код для отображения в посте
</div>
Другой возможный стиль выглядит следующим образом.
Установка происходит аналогично первому варианту, за исключением заменяется codice1 на codice2
.codice2 { margin : 15px 35px 15px 15px; padding : 10px; clear : both; list-style-type : none; background : #f9f9f9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1Rkez_pUrVGGiCuwpvsJBuHAPCuKT0mxqsbQfRylHlCLbEt2dbgK-oGI8ARjCXshegNBxAWHZQagRFLEsQZXwbY9az8ojLOlcXLNsnvwAv8IEm78LXXdGdihncx85C3In33kgxijmcDQ/s720/codice2.gif) no-repeat right bottom; border : 2px solid #eee; color : #7D7D7D; }
При публикации кода в посте используйте класс code2 вместо класса code1.
<div class='codice2'>
Код для отображения в посте
</div>
Наконец, третий вариант приведет к этому результату с отображением количества строк.
Код для вставки в шаблон выглядит следующим образом
Установка происходит аналогично первому варианту, за исключением заменяется codice1 на codice3
Установка происходит аналогично первому варианту, за исключением заменяется codice1 на codice3
.codice3 { margin : 10px; padding: 0px 25px 5px 40px; background : #ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFkDQp-NAPdKe-NNFdbBS2GDW6cpA9avFVPB7J6047nJ8Wq2Se_VbqPBekX4pHL7MMwUUe8QJd93z2LLp0CFm7NHeMGV7TXMmmy035e6xTmcSpd17Ikc7_zN4c74svzcQe9lIVPrZVZp8/s720/codice3.png) no-repeat top left; font: 0.9em Helvetica; color : #767675; border: 1px solid #767675; }
При публикации кода в посте используйте класс code3 вместо класса code1.
<div class='codice3'>
Код для отображения в посте
</div>