Commit 130c9240 authored by Rafael Peretti Pezzi's avatar Rafael Peretti Pezzi

Merge branch 'gitlab' into 'master'

Atualizando site CTA

See merge request CTA/site_CTA!1
parents 996ad504 13080c30
# Site do Centro de Tecnologia Acadêmica
Este site foi criado utilizando como base o tema [Creative](https://github.com/volny/creative-theme-jekyll) para o [Jekyll](https://jekyllrb.com/). Também utiliza icones da [font awesome](http://fontawesome.io/cheatsheet/).
## Introdução
A página inicial do CTA é um projeto desenvolvido com a ajuda do [Jekyll](https://jekyllrb.com/), um popular gerador de blogs e websites estáticos. Para edição da página, é necessário instalá-lo, conforme instruções a seguir.
## Instalação do Jekyll
Instale as dependências do Jekyll:
`$ sudo apt-get install ruby-full build-essential`
Instale o Jekyll e o Bundler usando RubyGems:
`$ sudo gem install jekyll bundler`
## Repositório git
A seguir, deve-se clonar o repositório site_CTA utilizando o git:
`$ git clone https://git.cta.if.ufrgs.br/CTA/site_CTA.git`
Caso o git não esteja instalado, instale-o:
`$ sudo apt-get install git`
Acesse o diretório clonado:
`$ cd site_CTA`
É recomendável criar um ramo para fazer edições ao projeto, posteriormente requisitando *merge* ("fusão") ao ramo principal (master) caso as mudanças sejam satisfatórias. Por exemplo, se o objetivo das edições à página é alterar a seção dos projetos, pode-se fazer:
`$ git branch projetos` (cria o ramo "projetos")
`$ git checkout projetos` (acesso ao ramo "projetos")
## Servindo com o Jekyll
A partir daí, para melhor acompanhamento das edições feitas à página, sirva-a com o Jekyll, usando seu endereço local:
`$ jekyll serve`
Você pode então acessar a página pelo endereço http://localhost:4000, ou pelo endereço mostrado ao lado de "Server Address", em seu navegador. Assim, é possível verificar os resultados das mudanças instantaneamente, bastando recarregar a página.
## Editando o site do CTA
O conteúdo da página está dividido em seções, estando cada uma delas em arquivos separados dentro do diretório `_include`. A ordem em que elas aparecem na exibição da página está disponível no arquivo `_layouts/front.html`. Edite o código destas seções conforme desejado, e atente-se para as mensagens no terminal cada vez que um arquivo modificado é salvo. Quando acabar a edição, simplesmente digite `Ctrl+c` para interromper o `jekyll serve`. Não faça alterações dentro do diretório `_site`; o mesmo será automaticamente atualizado conforme as mudanças são feitas no diretório `_include`.
### Imagens
As imagens utilizadas na página encontram-se no diretório `img`. Para adicionar imagens, salve-as neste diretório, preferencialmente mantendo a organização estabelecida. Imagens dos projetos são salvas na pasta `projetos`, enquanto símbolos, logos e headers estão soltos no diretório. Para adicionar uma imagem em HTML, utilize `<img src="img/figura">`, em que `figura` representa o caminho da imagem dentro do diretório `img`.
### Ícones
O site do CTA dispõe de ícones provenientes das bibliotecas *font-awesome*.
Para incluir um ícone em HTML, utilize a tag `<i>`, como no exemplo abaixo:
`<i class="fa fa-4x fa-lightbulb-o wow bounceIn text-primary" data-wow-delay=".3s"></i>`
Substitua o `lightbulb-o` pelo nome do ícone desejado. Uma lista de ícones disponíveis pode ser encontrada no arquivo `font-awesome/less/icons.less`
## Publicando no LIEF
Se você é usuário do LIEF do Instituto de Física, UFRGS, deve ser capaz de publicar a página do CTA no seu diretório `public_html`, tornando-a disponível para acesso em qualquer dispositivo com acesso à internet. Para tal, siga os passos abaixo do terminal, substituindo `seu_login` pelo seu usuário no LIEF.
1. Acesse sua conta no lief
`$ ssh seu_login@lief.if.ufrgs.br`
2. Crie o diretório `public_html` e configure para leitura pública
`$ mkdir public_html`
`$ chmod 755 public_html`
3. Saia do ambiente LIEF e volte para o acesso local com `Ctrl+d`.
4. De dentro do diretório clonado `site_CTA`, copie o diretório `_site` com o comando `scp` (secure copy):
`$ scp -r _site seu_login@lief.if.ufrgs.br:public_html`
Resta entrar no endereço http://lief.if.ufrgs.br/~seu_login/ usando um navegador de sua preferência e navegar nos seus arquivos do diretório `public_html`, onde deve se encontrar o site do CTA.
<section id="canais">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">Nossos principais canais</h2>
<hr class="primary">
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-git-square wow bounceIn text-primary"></i>
<h3>Repositórios git</h3>
<p class="text-muted">Muitos dos nossos projetos são mantidos em repositórios git. O CTA conta com uma <a href="https://git.cta.if.ufrgs.br/explore/projects">instalação do GitLab!</a></p>
</div>
</div>
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-lightbulb-o wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h3>Gestão de projetos</h3>
<p class="text-muted">Utilizamos o Chiliproject para organizar os projetos do CTA. Cada projeto tem Wiki, Fórum, Tarefas, Arquivos, entre outros. Veja <a href="http://cta.if.ufrgs.br/projects">a lista de projetos.</a></p>
</div>
</div>
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-group wow bounceIn text-primary" data-wow-delay=".5s"></i>
<h3>Foruns</h3>
<p class="text-muted"><a href="/projects/suporte-cta/boards">Fóruns</a> para discussões e registros das atividades. Destaque para os registros dos nossos <a href="/projects/suporte-cta/boards/7">encontros semanais</a> e dos <a href="/projects/suporte-cta/wiki/Projetos_ativos">encontros temáticos.</a></p>
</div>
</div>
</div>
<div class="row">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading">Nossos principais canais</h2>
<hr class="primary">
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-comments-o wow bounceIn text-primary"></i>
<h3>Listas de discussão</h3>
<p class="text-muted">Também utilizamos listas de discussões por e-mail. <a href="http://cta.if.ufrgs.br/projects/suporte-cta/wiki/Perguntas_Frequentes#Como-participar-das-listas-de-e-mails-do-CTA">Conheça nossas listas.</a></p>
<i class="fa fa-4x fa-git-square wow bounceIn text-primary"></i>
<h3>Repositórios git</h3>
<p class="text-muted">Muitos dos nossos projetos são mantidos em repositórios git. O CTA conta com uma <a href="https://git.cta.if.ufrgs.br/">instalação do GitLab!</a></p>
</div>
</div>
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-newspaper-o wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h3>Notícias</h3>
<p class="text-muted">Anuncios de eventos e atividades de destaque do CTA aparecem <a href="http://cta.if.ufrgs.br/news">aqui.</a> Você também pode assinar o <a href="http://cta.if.ufrgs.br/news.atom">feed RSS de notícias.</a></p>
</div>
</div>
<div class="col-lg-4 col-md-6 text-center">
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-angellist wow bounceIn text-primary" data-wow-delay=".5s"></i>
<h3>Eventos</h3>
<p class="text-muted">Frequentemente conduzimos oficinas, cursos e participamos de eventos de ensino, ciência e tecnologia. Confira a nossa <a href="http://cta.if.ufrgs.br/projects/suporte-cta/wiki/Eventos">página de eventos.</a></p>
</div>
<i class="fa fa-4x fa-lightbulb-o wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h3>Gestão de projetos</h3>
<p class="text-muted">Utilizamos o GitLab para armazenar os projetos do CTA. Cada projeto tem seu Repositório de Arquivos, Wiki e Issues. Veja <a href="https://git.cta.if.ufrgs.br/explore/projects">a lista de projetos</a>.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6 col-lg-offset-4 text-center">
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-question wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h3>Perguntas Frequentes</h3>
<p class="text-muted">Está com alguma dúvida? Veja nossa lista de <a href="http://cta.if.ufrgs.br/projects/suporte-cta/wiki/Perguntas_Frequentes">perguntas frequentes.</a></p>
<i class="fa fa-4x fa-group wow bounceIn text-primary" data-wow-delay=".5s"></i>
<h3>Fóruns</h3>
<p class="text-muted">Confira os Fóruns</a> para discussões e registros das atividades nas <a href="https://git.cta.if.ufrgs.br/suporte-cta/cta/issues">Issues</a> da <a href="https://git.cta.if.ufrgs.br/suporte-cta/cta">página de Suporte CTA</a>. Destaque para os registros dos nossos <a href="https://git.cta.if.ufrgs.br/suporte-cta/cta/issues?scope=all&utf8=%E2%9C%93&state=all&label_name[]=reuni%C3%A3o">encontros semanais</a></p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-comments-o wow bounceIn text-primary"></i>
<h3>Listas de discussão</h3>
<p class="text-muted">Também utilizamos listas de discussões por e-mail. <a href="https://git.cta.if.ufrgs.br/suporte-cta/cta/wikis/Saiba-mais-sobre-o-CTA!#como-participar-das-listas-de-e-mails-do-cta">Conheça nossas listas.</a></p>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-newspaper-o wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h3>Notícias</h3>
<p class="text-muted">Anúncios de eventos e atividades de destaque do CTA aparecem <a href="https://git.cta.if.ufrgs.br/suporte-cta/cta/wikis/Not%C3%ADcias">aqui.</a> Você também pode assinar o <a href="http://cta.if.ufrgs.br/news.atom">feed RSS de notícias.</a></p>
</div>
</div>
<div class="col-lg-4 col-md-6 text-center">
<div class="service-box">
<i class="fa fa-4x fa-angellist wow bounceIn text-primary" data-wow-delay=".5s"></i>
<h3>Eventos</h3>
<p class="text-muted">Frequentemente conduzimos oficinas, cursos e participamos de eventos de ensino, ciência e tecnologia. Confira a nossa <a href="https://git.cta.if.ufrgs.br/suporte-cta/cta/wikis/Eventos">página de eventos.</a></p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4 col-md-6 col-lg-offset-4 text-center">
<div class="service-box">
<i class="fa fa-4x fa-question wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h3>Perguntas Frequentes</h3>
<p class="text-muted">Está com alguma dúvida? Veja nossa lista de <a href="https://git.cta.if.ufrgs.br/suporte-cta/cta/wikis/Saiba-mais-sobre-o-CTA!">perguntas frequentes.</a></p>
</div>
</div>
</div>
</div>
</section>
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 text-center">
<h2 class="section-heading">Entre em contato!</h2>
<hr class="primary">
<p>Quer conversar? Entre em contato pelo nosso fórum, pela nossa lista de discussão ou apareça para tomar um café!</p>
</div>
<div class="col-lg-2 col-lg-offset-2 text-center">
<a href="http://cta.if.ufrgs.br/projects/suporte-cta/boards">
<i class="fa fa-group fa-3x wow bounceIn" data-wow-delay=".3s"></i>
<p>Fóruns de Suporte CTA</p>
</a>
<p>Ei... os projetos podem ter fóruns separados. Fique atente!</p>
</div>
<div class="col-lg-2 col-lg-offset-1 text-center">
<a href="http://cta.if.ufrgs.br/projects/suporte-cta/wiki/Perguntas_Frequentes#Como-participar-das-listas-de-e-mails-do-CTA">
<i class="fa fa-envelope-o fa-3x wow bounceIn" data-wow-delay=".2s"></i>
<p>Listas de e-mail</p>
</a>
<p>Se está recém chegando e quer saber mais, se cadastre na <a href="http://grupos.ufrgs.br/mailman/listinfo/fis_cta_adm-l">lista geral do CTA - [cta_adm-l]</a> e dê um alô.</p>
</div>
<div class="col-lg-2 col-lg-offset-1 text-center">
<a href="http://osm.org/go/M5uNbFBbB?layers=N&m=">
<i class="fa fa-coffee fa-3x wow bounceIn" data-wow-delay=".1s"></i>
<p>Apareça no CTA para um café</p>
</a>
<p>O CTA fica no Instituto de Física da UFRGS, na sala 110 do Prédio 43132 (Prédio L), Campus do Vale da UFRGS.</p>
</div>
</div>
<div class="row">
<div class="col-lg-12 text-center">
<i class="fa fa-3x fa-phone wow bounceIn text-primary" data-wow-delay=".3s"></i>
<p>(51) 3308 6553</p>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 text-center">
<h2 class="section-heading">Entre em contato!</h2>
<hr class="primary">
<p>Quer conversar? No momento, estamos trabalhando remotamente devido à situação da COVID-19, mas você pode entrar em contato pelo nosso Telegram ou pela nossa lista de discussão!</p>
</div>
<div class="col-lg-2 col-lg-offset-2 text-center">
<a href="https://t.me/joinchat/DDtLPUjFK2bs0wGmHyOI6Q">
<i class="fa fa-group fa-3x wow bounceIn" data-wow-delay=".3s"></i>
<p>Grupo do Telegram</p>
</a>
<p>Ao entrar no grupo, por favor, identifique-se e conte-nos seu objetivo.</p>
</div>
<div class="col-lg-2 col-lg-offset-1 text-center">
<a href="https://git.cta.if.ufrgs.br/suporte-cta/cta/wikis/Saiba-mais-sobre-o-CTA!#como-participar-das-listas-de-e-mails-do-cta">
<i class="fa fa-envelope-o fa-3x wow bounceIn" data-wow-delay=".2s"></i>
<p>Listas de e-mail</p>
</a>
<p>Se está recém chegando e quer saber mais, se cadastre na <a href="http://grupos.ufrgs.br/mailman/listinfo/fis_cta_adm-l">lista geral do CTA - [cta_adm-l]</a> e dê um alô.</p>
</div>
<div class="col-lg-2 col-lg-offset-1 text-center">
<a href="http://osm.org/go/M5uNbFBbB?layers=N&m=">
<i class="fa fa-map-marker fa-3x wow bounceIn" data-wow-delay=".1s"></i>
<p>Localização</p>
</a>
<p>O CTA fica no Instituto de Física da UFRGS, na sala 110 do Prédio 43132 (Prédio L), Campus do Vale da UFRGS.</p>
</div>
</div>
<div class="row">
<div class="col-lg-12 text-center">
<i class="fa fa-3x fa-phone wow bounceIn text-primary" data-wow-delay=".3s"></i>
<p>(51) 3308 6553</p>
</div>
</div>
</section>
<header>
<div class="header-content">
<div class="header-content-inner">
<h1>Centro de Tecnologia Acadêmica</h1>
<hr>
<h3>Novos paradigmas da criação, uso e disseminação do conhecimento.</h3>
<p><i class="fa fa-4x fa-unlock wow bounceIn text-primary" data-wow-delay=".3s"></i></p>
<a href="#sobre" class="btn btn-primary btn-xl page-scroll">Saiba mais</a>
</div>
</div>
<div class="header-content">
<div class="header-content-inner">
<h1>Centro de Tecnologia Acadêmica</h1>
<hr>
<h3>Novos paradigmas da criação, uso e disseminação do conhecimento.</h3>
<p><i class="fa fa-4x fa-unlock wow bounceIn text-primary" data-wow-delay=".3s"></i></p>
<a href="#sobre" class="btn btn-primary btn-xl page-scroll">Saiba mais</a>
</div>
</div>
</header>
<section class="bg-primary" id="sobre">
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 text-center">
<h2 class="section-heading">Liberdade do conhecimento!</h2>
<hr class="light">
<p class="text-faded">O Centro de Tecnologia Acadêmica do Instituto de Física da UFRGS busca desenvolver e aplicar todas as formas de conhecimento livre e aberto. Tem atuado no desenvolvimento de instrumentos científicos educacionais utilizando o conceito de hiperobjetos. Faz isso utilizando software livre e disponibilizando toda a sua criação em repositório público sob os termos de licenças permissivas. </p>
<a href="#principios" class="btn btn-default btn-xl page-scroll">Mais sobre o CTA</a>
<a href="#projetos" class="btn btn-default btn-xl page-scroll">Conheça Alguns Projetos!</a>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-lg-8 col-lg-offset-2 text-center">
<h2 class="section-heading">Liberdade do conhecimento!</h2>
<hr class="light">
<p class="text-faded">O Centro de Tecnologia Acadêmica do Instituto de Física da UFRGS busca desenvolver e aplicar todas as formas de conhecimento livre e aberto. Tem atuado no desenvolvimento de instrumentos científicos educacionais utilizando o conceito de hiperobjetos. Faz isso utilizando software livre e disponibilizando toda a sua criação em repositório público sob os termos de licenças permissivas. </p>
<a href="#principios" class="btn btn-default btn-xl page-scroll">Mais sobre o CTA</a>
<a href="#projetos" class="btn btn-default btn-xl page-scroll">Conheça Alguns Projetos!</a>
</div>
</div>
</div>
</section>
<nav id="mainNav" class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand page-scroll" href="#page-top">CTA - IF/UFRGS</a>
</div>
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand page-scroll" href="#page-top">CTA - IF/UFRGS</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li>
<a class="page-scroll" href="#sobre">Sobre</a>
</li>
<li>
<a class="page-scroll" href="#principios">Princípios</a>
</li>
<li>
<a class="page-scroll" href="#projetos">Projetos</a>
</li>
<li>
<a class="page-scroll" href="#canais">Canais</a>
</li>
<li>
<a class="page-scroll" href="#contact">Contato</a>
</li>
<li>
<a href="http://cta.if.ufrgs.br/welcome">Entrar</a>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container-fluid -->
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li>
<a class="page-scroll" href="#sobre">Sobre</a>
</li>
<li>
<a class="page-scroll" href="#principios">Princípios</a>
</li>
<li>
<a class="page-scroll" href="#projetos">Projetos</a>
</li>
<li>
<a class="page-scroll" href="#canais">Canais</a>
</li>
<li>
<a class="page-scroll" href="#contact">Contato</a>
</li>
<li>
<a href="https://git.cta.if.ufrgs.br">Entrar</a>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container-fluid -->
</nav>
<section id="principios">
<div class="container">
<center><img src="img/LogoCTA_2015_500px.png" class="img-responsive" alt=""></center>
<p></p>
<div class="row">
<div class="col-lg-12 text-center">
<i class="fa fa-4x fa-heart wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h2 class="section-heading">Nossos princípios</h2>
<hr class="primary">
<p class="text-muted">Fazemos o que fazemos pois acreditamos que podemos melhorar o mundo refletindo sobre e ampliando o acesso ao conhecimento científico, tecnológico e educacional. Para saber mais sobre o que nos move, leia o artigo <a href="https://cta.if.ufrgs.br/attachments/download/4229/Desenvolvimento_de_tecnologia_para_ci%C3%AAncia_e_educa%C3%A7%C3%A3o_fundamentado_nos_preceitos_de_liberdade_do_conhecimento_o_caso_do_Centro_de_Tecnologia_Acad%C3%AAmica.pdf">Desenvolvimento de tecnologia para ciência e educação fundamentado nos preceitos de liberdade do conhecimento: o caso do Centro de Tecnologia Acadêmica. in LiinC em Revista; v. 13, n. 1 (2017).</a></p>
<a href="#projetos" class="btn btn-primary btn-xl page-scroll">Agora me mostre uns projetos!</a>
</div>
</div>
</div>
<div class="container">
<center><img src="img/LogoCTA_2015_500px.png" class="img-responsive" alt=""></center>
<p></p>
<div class="row">
<div class="col-lg-12 text-center">
<i class="fa fa-4x fa-heart wow bounceIn text-primary" data-wow-delay=".3s"></i>
<h2 class="section-heading">Nossos princípios</h2>
<hr class="primary">
<p class="text-muted">Fazemos o que fazemos pois acreditamos que podemos melhorar o mundo refletindo sobre e ampliando o acesso ao conhecimento científico, tecnológico e educacional. Para saber mais sobre o que nos move, leia o artigo <a href="https://cta.if.ufrgs.br/attachments/download/4229/Desenvolvimento_de_tecnologia_para_ci%C3%AAncia_e_educa%C3%A7%C3%A3o_fundamentado_nos_preceitos_de_liberdade_do_conhecimento_o_caso_do_Centro_de_Tecnologia_Acad%C3%AAmica.pdf">Desenvolvimento de tecnologia para ciência e educação fundamentado nos preceitos de liberdade do conhecimento: o caso do Centro de Tecnologia Acadêmica. in LiinC em Revista; v. 13, n. 1 (2017).</a></p>
<a href="#projetos" class="btn btn-primary btn-xl page-scroll">Agora me mostre uns projetos!</a>
</div>
</div>
</div>
</section>
This diff is collapsed.
# Site do Centro de Tecnologia Acadêmica
Este site foi criado utilizando como base o tema [Creative](https://github.com/volny/creative-theme-jekyll) para o [Jekyll](https://jekyllrb.com/). Também utiliza icones da [font awesome](http://fontawesome.io/cheatsheet/).
## Introdução
A página inicial do CTA é um projeto desenvolvido com a ajuda do [Jekyll](https://jekyllrb.com/), um popular gerador de blogs e websites estáticos. Para edição da página, é necessário instalá-lo, conforme instruções a seguir.
## Instalação do Jekyll
Instale as dependências do Jekyll:
`$ sudo apt-get install ruby-full build-essential`
Instale o Jekyll e o Bundler usando RubyGems:
`$ sudo gem install jekyll bundler`
## Repositório git
A seguir, deve-se clonar o repositório site_CTA utilizando o git:
`$ git clone https://git.cta.if.ufrgs.br/CTA/site_CTA.git`
Caso o git não esteja instalado, instale-o:
`$ sudo apt-get install git`
Acesse o diretório clonado:
`$ cd site_CTA`
É recomendável criar um ramo para fazer edições ao projeto, posteriormente requisitando *merge* ("fusão") ao ramo principal (master) caso as mudanças sejam satisfatórias. Por exemplo, se o objetivo das edições à página é alterar a seção dos projetos, pode-se fazer:
`$ git branch projetos` (cria o ramo "projetos")
`$ git checkout projetos` (acesso ao ramo "projetos")
## Servindo com o Jekyll
A partir daí, para melhor acompanhamento das edições feitas à página, sirva-a com o Jekyll, usando seu endereço local:
`$ jekyll serve`
Você pode então acessar a página pelo endereço http://localhost:4000, ou pelo endereço mostrado ao lado de "Server Address", em seu navegador. Assim, é possível verificar os resultados das mudanças instantaneamente, bastando recarregar a página.
## Editando o site do CTA
O conteúdo da página está dividido em seções, estando cada uma delas em arquivos separados dentro do diretório `_include`. A ordem em que elas aparecem na exibição da página está disponível no arquivo `_layouts/front.html`. Edite o código destas seções conforme desejado, e atente-se para as mensagens no terminal cada vez que um arquivo modificado é salvo. Quando acabar a edição, simplesmente digite `Ctrl+c` para interromper o `jekyll serve`. Não faça alterações dentro do diretório `_site`; o mesmo será automaticamente atualizado conforme as mudanças são feitas no diretório `_include`.
### Imagens
As imagens utilizadas na página encontram-se no diretório `img`. Para adicionar imagens, salve-as neste diretório, preferencialmente mantendo a organização estabelecida. Imagens dos projetos são salvas na pasta `projetos`, enquanto símbolos, logos e headers estão soltos no diretório. Para adicionar uma imagem em HTML, utilize `<img src="img/figura">`, em que `figura` representa o caminho da imagem dentro do diretório `img`.
### Ícones
O site do CTA dispõe de ícones provenientes das bibliotecas *font-awesome*, como a lâmpada na ilustração abaixo.
(lamp)
Para incluir um ícone em HTML, utilize a tag `<i>`, como no exemplo abaixo:
`<i class="fa fa-4x fa-lightbulb-o wow bounceIn text-primary" data-wow-delay=".3s"></i>`
Substitua o `lightbulb-o` pelo nome do ícone desejado. Uma lista de ícones disponíveis pode ser encontrada no arquivo `font-awesome/less/icons.less`
## Publicando no LIEF
Se você é usuário do LIEF do Instituto de Física, UFRGS, deve ser capaz de publicar a página do CTA no seu diretório `public_html`, tornando-a disponível para acesso em qualquer dispositivo com acesso à internet. Para tal, siga os passos abaixo do terminal, substituindo `seu_login` pelo seu usuário no LIEF.
1. Acesse sua conta no lief
`$ ssh seu_login@lief.if.ufrgs.br`
2. Crie o diretório `public_html` e configure para leitura pública
`$ mkdir public_html`
`$ chmod 755 public_html`
3. Saia do ambiente LIEF e volte para o acesso local com `Ctrl+d`.
4. De dentro do diretório clonado `site_CTA`, copie o diretório `_site` com o comando `scp` (secure copy):
`$ scp -r _site seu_login@lief.if.ufrgs.br:public_html`
Resta entrar no endereço http://lief.if.ufrgs.br/~seu_login/ usando um navegador de sua preferência e navegar nos seus arquivos do diretório `public_html`, onde deve se encontrar o site do CTA.
This diff is collapsed.
This diff is collapsed.
_site/img/projetos/fisiolog.png

15.2 KB | W: | H:

_site/img/projetos/fisiolog.png

9.15 KB | W: | H:

_site/img/projetos/fisiolog.png
_site/img/projetos/fisiolog.png
_site/img/projetos/fisiolog.png
_site/img/projetos/fisiolog.png
  • 2-up
  • Swipe
  • Onion skin
_site/img/projetos/jb.jpg

102 KB | W: | H:

_site/img/projetos/jb.jpg

114 KB | W: | H:

_site/img/projetos/jb.jpg
_site/img/projetos/jb.jpg
_site/img/projetos/jb.jpg
_site/img/projetos/jb.jpg
  • 2-up
  • Swipe
  • Onion skin
_site/img/projetos/tropos.png

9 KB | W: | H:

_site/img/projetos/tropos.png

11.7 KB | W: | H:

_site/img/projetos/tropos.png
_site/img/projetos/tropos.png
_site/img/projetos/tropos.png
_site/img/projetos/tropos.png
  • 2-up
  • Swipe
  • Onion skin
This diff is collapsed.
img/projetos/fisiolog.png

15.2 KB | W: | H:

img/projetos/fisiolog.png

9.15 KB | W: | H:

img/projetos/fisiolog.png
img/projetos/fisiolog.png
img/projetos/fisiolog.png
img/projetos/fisiolog.png
  • 2-up
  • Swipe
  • Onion skin
img/projetos/jb.jpg

102 KB | W: | H:

img/projetos/jb.jpg

114 KB | W: | H:

img/projetos/jb.jpg
img/projetos/jb.jpg
img/projetos/jb.jpg
img/projetos/jb.jpg
  • 2-up
  • Swipe
  • Onion skin
img/projetos/tropos.png

9 KB | W: | H:

img/projetos/tropos.png

11.7 KB | W: | H:

img/projetos/tropos.png
img/projetos/tropos.png
img/projetos/tropos.png
img/projetos/tropos.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment