Le petit théatre de votre blog

Comment améliorer votre CanalBlog

01 janvier 2005

Rendre le code lisible

 Avant d'essayer de modifier le code, nous vous conseillons de retravailler sa presentation à l'image de ce que nous avons fait dans les écran précédants.

Ca demande un bon moment (j'ai mis environs dix minutes pour faire la page d'accueil),  mais ce n'est pas compliqué.

Pour ce faire commencez par isoler les balises (les trucs entre <>)
Puis à chaque fois que vous trouvez une balise ouvrante (comme <div>) décalez les lignes suivantes de deux espaces.
A chaque fois que vous trouvez une balise fermant, c'est à dire avec un / (comme </div>) décalez la vers la gauche de 2 espaces par rapport à la ligne du dessus. 

Attention ! Ne faite pas cette manipulation dans la ligne document.write si vous l'avez, ça ne marcherai plus. 

<script type="text/javascript">
          <!--
          document.write('<a href="<$BlogOwnerNoSpamEmailLink$>">Contactez l'auteur</a>'); // --> 
 </script>

Vous devez obtenir quelque chose comme çà (le code différe suivant les options que vous aurrez choisi dans le deisign de votre blog) :

<body>
<div id="container">
  <div id="topbar">
    <h1>
      <a href="<$BlogURL$>">
        <$BlogTitle$>
      </a>
    </h1>
    <h2>
      <$BlogDescription$>
    </h2>
  </div>
  <div id="leftbar">
    <div class="navlinks">
      <div class="title">
        Cat&eacute;gories
      </div>
      <ul>
        <CBCategories>
          <li>
            <a href="<$BlogCategoryURL$>">
              <$BlogCategoryName$>
            </a>
          </li>
        </CBCategories>
      </ul>
      <div class="item">
        <script type="text/javascript">
          <!--
          document.write('<a href="<$BlogOwnerNoSpamEmailLink$>">Contactez l'auteur</a>'); // -->
        </script>
      </div>
      <BlogSiteFeed>
        <div class="item">
          <a href="<$BlogSiteFeedURL$>" title="Syndiquez ce blog">
            Version XML
          </a>
        </div>
      </BlogSiteFeed>
    </div>
  </div>
  <div id="content">
    <div class="blogbody">
      <Blogger>
        <BlogDateHeader>
          <h2>
            <$BlogDateHeaderDate$>
          </h2>
        </BlogDateHeader>
        <a name="<$BlogItemNumber$>">
        </a>
        <BlogItemTitle>
          <h3>
            <$BlogItemTitle$>
          </h3>
        </BlogItemTitle>
        <p>
          <$BlogItemBody$>
        </p>
        <div class="itemfooter">
          Post&eacute; par <$BlogItemAuthorNickname$> &agrave; <$BlogItemDateTime$>
          <BlogItemCategories>
             -
             <a href="<$BlogItemCategoryLink$>" title="Autres messages dans cette cat&eacute;gorie">
                <$BlogItemCategoryName$>
             </a>
          </BlogItemCategories>
          <BlogItemComments>
             -
            <a href="<$BlogItemCommentsURL$>" title="Commentez ce message">
              Commentaires [<$BlogItemCommentsCount$>]
            </a>
          </BlogItemComments>
          <BlogItemTrackBacks>
             -
            <a href="<$BlogItemTrackBacksURL$>" title="R&eacute;troliens">
              R&eacute;troliens [<$BlogItemTrackBacksCount$>]
            </a>
          </BlogItemTrackBacks>
           - Permalien [
          <a href="<$BlogItemURL$>" title="Lien permanent vers ce message">
          #
          </a>
          ]
        </div>
      </Blogger>
    </div>
  </div>
  <div style="clear: both;height:0px;">
    &nbsp;
  </div>
</div>
</body>

Posté par Babouze à 12:00 - 1- Mode avancé - B.A. BA - Commentaires [1] - Permalien [#]

Commentaires

    juste merci!!

    Posté par mideul, 04 novembre 2007 à 19:59

Poster un commentaire