Usar o SquareSpace para editar html/css
estou a tentar criar um site no Squarespace e estou a ter dificuldade em Seleccionar elementos na minha página HTML para usar no css personalizado. Quando eu uso o elemento inspecionar no meu navegador, os ids para alguns elementos mudam, enquanto outros são constantes.
estou a correr o modo de desenvolvimento e transferi o código para a minha máquina local através do github.
no ficheiro downloaded site.region encontrei o elemento div que contém o conteúdo que estou a tentar estilo:
<div id="content" class="main-content" data-content-field="main-content" data-collection-id="{collection.id}" {.equal? collection.typeName "gallery"}{.or}{.equal? collection.typeName "index"}{.or}data-edit-main-image="Banner"{.end}{.end}>
{squarespace.main-content}
</div>
onde é que {squarespace.main-content} vem de e como seleciono elementos dentro dele para o estilo?
2 answers
...qualquer ID que comece com " yui " pode / vai mudar na página actualizar...entanto...IDs do bloco (o ID começa com "bloco-" não mudar desde que o bloco não seja removido...
A respeito de onde vem o {[[0]}, isto é uma marca JSON-T que diz ao servidor para carregar o conteúdo tal como introduzido dentro o sistema de gestão de conteúdos (também conhecido por "motor de disposição") para essa página. Onde quer que essa tag esteja, o conteúdo do motor de Layout para essa página será carregado.
Finalmente, em relação a como seleccionar os elementos dentro do conteúdo principal para estilo com CSS, você está no caminho certo. Inspecionar os elementos como você está fazendo. Se quiser apontar para um bloco específico, procure a identificação a começar por block- e aponte para eles. Ou encontrar outras formas de atingir o elemento, tais como :first-child ou nth-child selectores. Entao indique o seu CSS em O Editor de CSS ou, se estiver a usar o modo de desenvolvimento (como indicou que está), adicione as regras à sua base.menos ficheiro (ou outros ficheiros CSS, consoante o caso) e depois actualiza o seu modelo usando o Git ou o SFTP.
Uma última nota que não precisa de usar o modo de desenvolvimento para atingir os elementos com CSS. Você pode simplesmente direcionar os elementos certos, como mencionado, em seguida, digite as regras no editor CSS, como mencionado, de modo que pode não haver necessidade de adicionar complexidade do modo de desenvolvimento.
Em squarespace fazer isto:
Ative a opção dos desenvolvedores ( para editar JS é obrigatório pelo menos, não tenho certeza sobre CSS),
Go to DESIGN "" CSS personalizado
Adicionar / alterar o que quiser aí, deverá estilo classes ou selector de css como
nth-child/nth-of-typeem vez desses IDs dinâmicos.
Pode ver mais informação aqui: