E ai pessoal, esse é o terceiro post sobre SyntaxHighlighter (SHL), e nesse post vamos aprender a alterar a cor da nossa ferramenta, vamos personalizar a identidade visual.
<!-- configuracao do tema, css usado, default, branco, inicio --> <link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>Para o blog DevIsComing eu achei que essa identidade era a adequada e a que mais combinava com o restante do site, mas nos temos vários opções:
Nome | Arquivo |
---|---|
Default | shThemeDefault.css |
Django | shThemeDjango.css |
Eclipse | shThemeEclipse.css |
Emacs | shThemeEmacs.css |
Fade To Grey | shThemeFadeToGrey.css |
Midnight | shThemeMidnight.css |
RDark | shThemeRDark.css |
Clicando em um dos itens na coluna "Nome" será possível ver o resultado da sua ferramenta quando aplicado o css localizado na coluna "Arquivo".
E para facilitar, caso tenha optado por hospedar o SHL no seu servidor, clicando em um dos itens da coluna "Arquivo", você será redirecionado para a CDN onde estão localizados os arquivos .css, dessa forma basta clicar com botão direito na página, selecionar "Salvar como" e com um cliente FTP enviar o arquivo .css para o seu servidor e realizar as alterações no seu fonte.
E para facilitar, caso tenha optado por hospedar o SHL no seu servidor, clicando em um dos itens da coluna "Arquivo", você será redirecionado para a CDN onde estão localizados os arquivos .css, dessa forma basta clicar com botão direito na página, selecionar "Salvar como" e com um cliente FTP enviar o arquivo .css para o seu servidor e realizar as alterações no seu fonte.
<!-- configuracao do tema, css usado, midnight, azul escuro, inicio --> <link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeMidnight.css' rel='stylesheet' type='text/css'/>A vantagem de ter nesse momento os arquivos no seu servidor e não estar usando a CDN do SHL, é que caso deseje alterar alguma coisa, basta editar o arquivo css e será possível customizar ainda a identidade da sua ferramenta.
Sobre a identidade visual é isso!
No próximo post eu vou estar explicando sobre o atributo class, os parâmetros que podemos estar passando para nossa ferramenta e algumas configurações no script de inicialização do SHL.
Até a próxima!
Nenhum comentário:
Postar um comentário