Блог Иннушки: Публиковать код программ, скриптов в блоге

Блог Иннушки: Публиковать код программ, скриптов в блоге:

Стараюсь делиться полезной информацией с читателями. При этом, иногда нужно в сообщение вставить код - скрипта, гаджета, каких-либо настроек. Как можно размещать коды в блоге, чтобы они нормально отображались? Нашла три способа вставки кодов в публикацию. 1 способ. Самый простой. В настройках каждого сообщения, при его создании, есть пункт Параметры со значком - шестеренкой. Кликнув по нему, можно выбрать настройки. В частности, режим редактирования - отмечаем "Показ кода HTML". Затем нажимаем кнопку Готово. Всё. теперь можно просто вставлять различные коды скриптов, программ и т.п. в сообщение, как обычный текст. Но рекомендую в случае использования этого способа отделить код от обычного текста - другим шрифтом, цветом, фоном, например. 2 способ. При помощи сниппета. Идею взяла отсюда: [url]http://edublogru.blogspot.ru/2014/03/blog-post.html[/url] Никогда не использовала. Учусь вместе с Вами. Если я правильно поняла (да простят меня программисты и другие умные люди, если это не так), сниппет - визуально оформленная часть готового кода, который можно скопировать и использовать повторно. 1) Бесплатно регистрируемся на сайте [url]https://github.com/[/url] 2) Не выходя из аккаунта, переходим по ссылке [url]https://gist.github.com/[/url] 3) Далее пишем название, описание (если нужно). 4) Вставляем код   5) Нажимаем на кнопку Create public gist  6) Копируем ссылку на наш созданный сниппет - в рамке, рядом со словом Embed   7) Переходим в режим редактирования сообщения HTML и вставляем скопированную ссылку:  8) Переходим обратно. В сообщении ничего не видно - только в режиме "Просмотр" и после публикации поста. (Ура! Получилось!) view rawКод спойлера hosted with ❤ by GitHub Теперь наш код удобно просматривать и копировать, есть нумерация строк.  И 3 способ вставки кода в сообщение. При помощи спойлера (скрывающегося текста). Этот способ я использовала в статье Гаджет "Обратная связь" для Blogger Большое спасибо автору кода. Сам код спойлера я уже разместила выше - когда училась создавать сниппет (ух ты, сколько умных слов теперь знаю). То есть берете код, размещенный, с нумерацией строк, копируете себе в программку Блокнот. Сохраняете файл на компьютере. И используете по необходимости))) Или сразу в сообщение на Blogger'е вставляете. Можно заменить слова Open/Сlose на русские Открыть/Закрыть (или на другие) - в конце строки № 3. Конец 3-ей строки: ..... margin: 0px; padding: 0px; width: 60px;" type="button" value="Open/Close" /> </div> Код, который хотите, чтобы был скрытым, вставляете вместо слов "Здесь Ваш текст, скрипт или картинка". Проверим, что получилось?   <div style="margin: 5px 20px 20px;"> <div class="smallfont" style="margin-bottom: 2px;"> <b>Spoiler</b>: <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" type="button" value="Open/Close" /> </div> <div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;"> <div style="display: none;"> Здесь Ваш текст, скрипт или картинка <br> </div> </div> </div>