Ridimensionare i blocchi

Modifica i blocchi di contenuto del sito in modo che siano più grandi o più piccoli.

Ultimo aggiornamento 17 giugno 2024

Ridimensiona i blocchi in qualsiasi momento per modificare i layout e visualizzare i contenuti in nuovi modi. Il modo in cui si ridimensionano i blocchi dipende dall'editor e blocchi diversi possono avere un comportamento di ridimensionamento diverso. Questa guida esamina alcuni modi per ridimensionare i blocchi.

Gli esempi presentati in questa guida utilizzano una Pagina di layout, ma è possibile aggiungere e ridimensionare i blocchi in molte aree diverse del tuo sito. Per informazioni sulla riorganizzazione dei blocchi in un'area contenuto, visita Spostare i blocchi per personalizzare i layout.

Guarda un video  

Ridimensionare i blocchi in Editor fluido

Editor fluido è la più recente esperienza di editing di Squarespace. È supportato sui siti della versione 7.1, ovunque sia possibile aggiungere sezioni di blocco. Se un pulsante Aggiungi blocco si visualizza in alto a sinistra durante la modifica, quella sezione utilizza Editor fluido.

In Editor fluido, ridimensiona i blocchi direttamente sulla pagina facendo clic e trascinando:

  1. Clicca su Modifica nella pagina.
  2. Clicca sul blocco che desideri ridimensionare. Per ridimensionarne più di uno contemporaneamente, clicca e trascina sullo sfondo della sezione per evidenziare tutti quelli che vuoi ridimensionare.
  3. Passa il mouse su uno dei quadrati del contorno di un blocco finché il cursore non diventa una freccia, quindi clicca e trascina per aumentare o diminuire la larghezza, l'altezza o entrambi i valori del blocco. Tieni premuto o Ctrl durante il trascinamento per ridimensionare il blocco in modo simmetrico. Sullo sfondo viene visualizzata una griglia per facilitare il ridimensionamento.
  4. Fai clic sull'icona Visualizzazione mobile per ridimensionare i blocchi sul layout per dispositivi mobili. Il ridimensionamento dei blocchi nella visualizzazione per computer non ridimensiona i blocchi nel layout per dispositivi mobili.
  5. Clicca su Salva per salvare il lavoro e continuare ad apportare modifiche, oppure clicca su Esci e poi su Salva per chiudere l'editor.

Tieni presente che il ridimensionamento può variare in base ai diversi tipi di blocchi. Ad esempio, puoi modificare la larghezza di un blocco modulo, ma l'unico modo per modificarne l'altezza è aggiungere o rimuovere campi.

Nota

il tweak di stile Larghezza pagina (Max) può influire sulla capacità di ridimensionare i blocchi nell'Editor fluido. Se non riesci a ridimensionare un blocco, prova a cambiare il valore con una larghezza maggiore.

Ridimensiona gli indicatori

Quando si ridimensiona un blocco, vengono visualizzati degli indicatori gialli quando il blocco ha la stessa altezza, larghezza o altezza e larghezza degli altri blocchi della sezione. Ad esempio, se stai modificando la larghezza di un'immagine sopra un pulsante, gli indicatori gialli vengono visualizzati sui bordi superiore o inferiore di entrambi i blocchi quando la larghezza del blocco immagine corrisponde a quella del blocco pulsante. Quando si modifica l'altezza, gli indicatori gialli appaiono sul bordo sinistro o destro quando le altezze corrispondono e quando i blocchi hanno la stessa larghezza e altezza, gli indicatori delineano l'intero blocco.

When_resizing_blocks__indicators_display_when_boxes_match_height__width__or_both.png

Ridimensionare i blocchi nell'editor classico

Tutti i siti della versione 7.0 e punti specifici dei siti della versione 7.1 utilizzano il nostro editor classico nelle aree di contenuto a blocchi. Nell'editor classico, quando due o più blocchi sono posizionati uno accanto all'altro, si ridimensionano l'uno rispetto all'altro. Puoi usare questa funzione per ridimensionare i blocchi.

In particolare, i Blocchi spazio creano uno spazio vuoto e possono essere ridimensionati per ingrandire o rimpicciolire i blocchi adiacenti. Ad esempio, per centrare un blocco nell'area di contenuto, aggiungi un Blocco spazio su entrambi i lati, quindi regola entrambi i Blocchi spazio su una pari dimensione.

Suggerimento

linee guida di colore nero vengono visualizzate quando clicchi e trascini i blocchi. Se la linea guida si estende solo per l'altezza del blocco che stai ridimensionando, il Blocco spazio si limiterà a ridimensionare tale blocco. Se la linea guida si estende per l'intera altezza dell'area di contenuto, verrà creata una nuova colonna.

Per ridimensionare con i blocchi:

  1. Clicca su un punto di inserimento.
  2. Seleziona Blocco spazio o un altro blocco dal menu blocchi.
  3. Clicca sul nuovo blocco e trascinalo accanto al blocco che desideri ridimensionare.
add_spacer.gif
  1. Passa il mouse fra i due blocchi fino a quando il cursore non si trasformerà in un ridimensionatore di colonne, quindi clicca e trascina per regolarne le dimensioni. Così facendo, i blocchi adiacenti verranno ridimensionati, creando più spazio vuoto nell'area di contenuto.
centering_with_spacers.gif

Suggerimento

per creare dei layout più avanzati, consulta le nostre guide Spostare i blocchi e Creare righe e colonne.

Strumenti di ritaglio nell'editor classico

Nell'editor classico, puoi modificare l'altezza di alcuni blocchi con uno strumento di ritaglio, in modo che il contenuto possa ridimensionarsi senza distorsioni. Lo strumento di ritaglio è disponibile per i seguenti blocchi:

Per utilizzare lo strumento di ritaglio, clicca sul blocco, quindi clicca e trascina il cerchio che appare nella parte inferiore del blocco.

Suggerimenti per l'utilizzo dei blocchi dello strumento di ritaglio:

  • Tieni premuto il tasto Maiusc mentre trascini l'icona di ritaglio per ridimensionare l'immagine in incrementi di 20 pixel. In tal modo, è possibile allineare la parte inferiore dell'immagine con un altro blocco.
  • Nei blocchi immagine, lo strumento di ritaglio viene visualizzato solo dopo aver aggiunto un'immagine.
  • Fai doppio clic sull'icona di ritaglio per annullare il ritaglio.
  • Sposta lo strumento verso il basso per ingrandire il blocco.
  • Clicca sull'icona di ritaglio e trascinala verso il basso per ritagliare l'immagine orizzontalmente. Per i Blocchi immagine, l'immagine viene ingrandita, tagliando i lati.
cropping_handle.gif
Footer Image
  • Ricevi assistenza dalla nostra community

  • Ricevi assistenza dalla nostra community in merito alle personalizzazioni avanzate.

  • Affidati a uno Squarespace Expert

  • Fatti notare online con l'aiuto di un designer o di uno sviluppatore esperto.