Jakiś czas temu zacząłem używać Blogger-a, jako serwisu blogowego. Jestem pod wrażeniem w jak łatwy sposób można tworzyć posty oraz modyfikować istniejące, edytować layout itp. Jedna rzecz, która jest dość ważna w szczególności dla programistów, chcących wklejać swoje kawałki kodu, jest taka, że Blogger nie posiada na chwilę obecną narzędzia do wklejania kodu, który ładnie by się wyświetlał. W tym poście chciałbym opisać, jak w łatwy, szybki i ładny sposób wyświetlać kody w postach na bloggerze (kolorować składnie kodu). W tym celu potrzeba będzie wykorzystać SyntaxHighlighter Javascript Library.
Następujące rzeczy należy wykonać:
1. Skopiuj poniższy kod:
2. Wejdź do zakładki "Szablon":
3. Następnie kliknij w przycisk "Edytuj plik HTML":
4. Tuż przed znacznikiem </head> wklej skopiowany wyżej kod.
5. Zapisz szablon.
6. Następnie można rozpocząć tworzenie, bądź edytowanie starych postów z ładnie podświetlanym kodem. Należy wejść do sekcji "Posty". Następnie już w konkretnym formatowaniu danego posta należy przejść do sekcji "HTML"
7. W momencie, gdy chcemy wkleić jakiś kod należy przed, jak i po nowo wstawianym kodzie wstawić odpowiedni znacznik dla C++ będzie <pre class="brush: cpp"> jakiś kod w C++ </pre>, natomiast dla np. csharp <pre class="brush: csharp"> jakiđ kod w csharpie </pre>
int main(int argc, char **argv)
{
std::cout << "Hello world!" << std::endl;
return 0;
}
Efekt pokazy został poniżej:
int main(int argc, char **argv)
{
std::cout << "Hello world!" << std::endl;
return 0;
}
Istnieje kilka rzeczy na, które należy zwrócić uwagę:
- Java script używa <code> Tag. Tak więc wiele szablonów posiada styl dla tego tagu. Może więc zaistnieć sytuacja, żeby będziesz musiał usunąć styl, że kod ładnie się formatował.
- Czasem klikając w podgląd kod wyświetli się nie sformatowany. Jednak, gdy później damy "Opublikuj" wszystko powinno być ok.
Brak komentarzy:
Prześlij komentarz