Indentare il testo del paragrafo?

Supporto
1

Mi sento un idiota, ma non riesco proprio a capire perché questo non funzioni:

<div style="margin-left: 20px">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

che produce:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

che notevolmente non è indentato!

Sicuramente ci deve essere un modo per supportare l’indentazione del testo, anche se è poco intuitivo per qualsiasi motivo, vero?

2

   Uso un paio di &emsp; se ho bisogno di indentare qualcosa, ma questo funziona solo per la prima riga.

1 Mi Piace
3

Questo fa solo la prima riga di un paragrafo, però

1 Mi Piace
4

Mi sembra che ce l’abbia sulla punta della lingua. :slightly_smiling_face:

Modifica: Mi ero confuso con l’aggiunta di quattro spazi a un nuovo paragrafo in un elemento di lista per mantenerlo allineato.

Ho scoperto che puoi racchiudere un blocco di testo in <ul> </ul> e questo lo indenta. È un po’ una soluzione di ripiego, ma potrebbe essere utile se non hai accesso alle impostazioni di amministrazione per creare la soluzione di wrapping dal basso.

Ad esempio.

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
1 Mi Piace
5

Sono abbastanza sicuro che quattro spazi siano un blocco di codice in Markdown

1 Mi Piace
6

Discourse whitelista solo alcuni tag e attributi HTML. Suppongo che blocchino completamente l’attributo style poiché è fondamentalmente onnipotente.

1 Mi Piace
7

C’è un modo per consentire più tag/attributi nelle impostazioni del nostro sito?

8

Non vedo nulla nelle impostazioni del sito, ma forse potresti farlo con un plugin. Ho trovato due file che menzionano tag HTML che potrebbero essere utili da esaminare. Personalmente penso che sarebbe pericoloso consentire l’attributo style.

1 Mi Piace
9

Credo che lo stile div non sia nella whitelist, avresti bisogno di un plugin o di un componente. Ma puoi creare un bbcode wrap direttamente nel tuo forum di amministrazione. Aggiungi queste righe in Personalizza > il tuo tema o componente > CSS Comune

[data-wrap="indent"] {
    margin-left: 20px;
}

Quindi nel tuo post, usa questo per il testo che desideri:

[wrap="indent"]
Il tuo paragrafo
[/wrap]
9 Mi Piace
10

Non sapevo che si potesse fare. Ho usato gli span con un attributo data-theme sul mio forum:

image
image372×172 4.02 KB

(puoi vederlo qui: 📜 [Wiki] Schlumpf hub serial numbers reference - Unicycles and Equipment - Unicyclist.com)

La cosa [wrap] è diversa in qualche modo? Possiamo usarla per stili inline?
Ci sono altri modi per personalizzare gli stili dei post?

1 Mi Piace
11

Dato che usiamo l’elemento div, possiamo personalizzare un po’ molto, ma per gli stili inline, la tua opzione è la migliore secondo me.

Non sono sicuro se ci siano molte altre opzioni pronte all’uso. Quando uso qualcosa spesso, ricorro a un plugin o a un componente per creare una classe div o un bbcode e aggiungo un’icona nella barra degli strumenti.

12

Una semplice domanda… Come si fa?

13

Puoi usare il mio tema-component come esempio:

Hai due opzioni, aggiungere un’icona alla barra degli strumenti o al menu a ingranaggio

image
image485×241 3.13 KB

Barra degli strumenti:

api.onToolbarCreate(toolbar => {
    toolbar.addButton({
        id: "align_justify_button",
        group: "extras",
        icon: "align-justify",
        perform: e => e.applySurround('[wrap="justify"]\n', '\n[/wrap]', 'align_justify_text')
    });
});

Menu a ingranaggio

api.addToolbarPopupMenuOptionsCallback(() => {
  return {
      action: "floatleft",
      icon: "indent",
      label: "float_left_button"
  };
});

Puoi avere alcune opzioni extra con un plugin, ma il componente dovrebbe essere sufficiente: GitHub - MonDiscourse/discourse-formatting-toolbar: Add formatting options on your post (center, align to right, justify a text, etc.)

5 Mi Piace