Removendo os extras do layout de WebCards

• Abril 16, 2024

Agora que temos nosso novo modelo definido como o modelo padrão para o sistema WebCards, podemos começar a personalizar o layout. Como mencionamos anteriormente, temos apenas 510 px para trabalhar em nossa página de fãs no Facebook. Uma maneira de economizar espaço é remover o Calendário de Eventos e a Nuvem de Pesquisa à direita do layout.

Calendário de eventos e nuvem de pesquisa

O modelo em que precisaremos trabalhar é o modelo view_image_stats.html. Como você pode ver, esse modelo é basicamente uma tabela com cinco células. A primeira célula que contém os links do menu lateral recebe 15% da largura total da tabela e as próximas três células que contêm as miniaturas recebem 20% cada. A última célula da tabela que contém o calendário e a nuvem recebe 25%.

Uma maneira fácil de remover o calendário e a nuvem é remover a quinta célula da tabela. Obviamente, também removeremos 25% da tabela. Portanto, precisamos espalhar esses 25% pelas células restantes.

Primeira célula - 15 torna-se 25
Segunda célula - 20 se torna 25
Terceira célula - 20 se torna 25
Quarta célula - 20 torna-se 25
Quinta célula - 25

Quando atualizamos o navegador, não vemos nenhuma alteração. Isso ocorre porque precisamos limpar o cache para ver a alteração. Podemos fazer isso no Centro de administração. Na parte inferior do menu lateral, clique no link Gerenciar caches. Na página Gerenciar Caches, clique no botão Reconstruir Cache. Agora, podemos ver que o calendário e a nuvem foram removidos quando atualizamos novamente o navegador.

Todas as categorias Link

Temos um conjunto tão pequeno de cartões eletrônicos que realmente não precisamos do link Todas as categorias no menu lateral. Então, vamos remover esse link para tornar o menu lateral menos confuso. Nós precisaremos trabalhar em outro arquivo chamado functions.php. Este arquivo é armazenado na pasta de origem.

htdocs / webcards / source / functions.php

Para remover o link Todas as categorias, basta comentar uma linha de código. A partir da linha 1410, você verá um loop foreach. Dentro desse loop, está o código que cria o link Todas as categorias. Para comentar esta linha, adicione // antes da linha de código. Para ver a alteração, recrie o cache e atualize o navegador.

Layout horizontal

Você deve ter notado que, na primeira página do sistema, temos três listas verticais de miniaturas, que são Novas Imagens, Imagens Populares e Imagens Aleatórias. Como temos um conjunto tão pequeno de cartões eletrônicos, vemos algumas repetições. Seria melhor se usássemos um layout diferente que lista todas as miniaturas desta página em um layout horizontal. Em seguida, os links no menu lateral levam à exibição apenas das miniaturas em uma das duas categorias. Para fazer essa alteração no layout da primeira página, precisaremos trabalhar no arquivo index.php.

htdocs / webcards / index.php

A partir da linha 315, você verá a função view_stats_page. Adicionaremos uma linha de código que alterará o layout do modelo para a primeira página. Adicione esta linha sob as variáveis ​​globais.

retornar choose_image_template ($ messages);

//www.mywebcards.net

Capturas de tela de WebCards usadas com permissão.

Instruções De Vídeo: LG G8 Teardown - Dont Remove The Battery?! (Abril 2024).