Come posso fare in modo che blogger inserisca i tag <p> invece di <br> quando utilizzo l'editor rich text?


10

Non mi piace come quando uso l'editor rich text in Blogger e premo Enterinserisce un <br >invece di un <p>. C'è un modo per far cambiare il comportamento? O almeno c'è un modo per inserire un <p>senza passare alla scheda HTML?

A proposito, sto usando Blogger in versione bozza . Ho provato sia il vecchio editor che quello nuovo; e l'utilizzo al Press "Enter" for line breaksposto di Use <br /> tagsnon aiuta.

Ho anche provato a disabilitare Convert Line breaks, che è descritto come:

Se si seleziona Sì, i singoli ritorni rigidi inseriti nell'editor dei post verranno sostituiti con singoli <br />tag nel blog e due ritorni rigidi verranno sostituiti con due tag ( <br /><br />).


Una brutta soluzione, ma se vuoi sbarazzarti delle interruzioni di doppia linea puoi nascondere la seconda <br/>con una regola CSS come br+br {display: none}​in Tema > Modifica HTML dove troverai un sacco di stili sotto<head><b:skin><![CDATA[...
ccpizza,

Risposte:


10

Questo comportamento non è configurabile. Sia l'editor corrente, l'editor di bozze e l'editor "vecchio" usano una combinazione di tag BR e DIV quando dovrebbero usare tag P.

È una decisione sbalorditiva, ed è assolutamente sbagliata. Spiega molti problemi con il rendering incoerente dei paragrafi in Blogger. Forse funziona in IE, ma non funziona in modo coerente nei browser webkit come Chrome e Safari.

Penso che il nuovo editor inserisca due tag BR consecutivi, ma il più vecchio ha inserito un singolo DIV e un singolo BR.

Windows Live Writer di Microsoft fa le cose correttamente come indicato sopra. MarsEdit per OS X è meno coerente, penso che se inizia con un post creato da Blogger si ottiene confusione nei tag.

Condivido il tuo dolore.


Ma Live Writer può modificare un post esistente? Dal momento che molte persone, incluso me, amano pubblicare l'articolo, leggere e lucidare.
Gqqnbig,

4

Ho appena scoperto che se pubblichi subito il tuo post sul blog contenente p-tag anziché passare prima alla scheda HTML, i p-tag rimangono.

Esempio:

<p>
Here is a body text<br />
that is wrapped in p-tags<br />
</p>
  1. Vai a visualizzazione HTML.
  2. Inserisci il codice sopra.
  3. Fai clic sul pulsante Pubblica.

Se provi a guardare il codice nella scheda HTML, i p-tag saranno sostituiti dai div-tag.



0

Bene, non c'è modo di configurarlo con Blogger.

Ma quello che ho capito è che questo può essere fatto con jQuery.

Per fare ciò, devi andare nell'area del modello e fare clic su "modifica HTML". Fai una ricerca per /body. Appena sopra, inserisci <script src="http://code.jquery.com/jquery-1.10.1.min.js">Quindi inserisci <script></script>. Quello che hai ora, dovrebbe essere questo:

some code
<script src='http://code.jquery.com/jquery-1.10.1.min.js'/>
<script>

This is where the jQuery calls will go.

</script>
&lt/body&gt;
some more code

Le chiamate jQuery appropriate possono essere individuate da questa pagina in cui forniscono un esempio che chiede quasi esattamente cosa si desidera fare. Questo esempio è stato copiato di seguito (da http://api.jquery.com/contents/ )

<div class="container">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed
  do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  <br><br>
  Ut enim ad minim veniam, quis nostrud exercitation ullamco
  laboris nisi ut aliquip ex ea commodo consequat.
  <br><br>
  Duis aute irure dolor in reprehenderit in voluptate velit
  esse cillum dolore eu fugiat nulla pariatur.
</div>

Possiamo utilizzare il .contents()metodo per aiutare a convertire questo blocco di testo in tre paragrafi ben formati:

$( ".container" )
  .contents()
    .filter(function() {
      return this.nodeType === 3;
    })
      .wrap( "<p></p>" )
      .end()
    .filter( "br" )
    .remove();

Certo, dovrai fare alcune lievi modifiche di cui sopra per farlo funzionare. Ma che lascerò che tu lo capisca. :-)

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.