Mostrando entradas con la etiqueta cambiar de sitio la sidebar plantilla rounders. Mostrar todas las entradas
Mostrando entradas con la etiqueta cambiar de sitio la sidebar plantilla rounders. Mostrar todas las entradas

8.7.10

Cambiar sitio sidebar - Rounders


La sidebar de la plantilla Rounders está al lado derecho. La pasaremos al lado izquierdo.

Vamos a Editar HTML:

Diseño Plantilla Editar HTML Click dentro del editor Ctrl+f

  1. Localizamos los siguientes códigos poniendo, dentro del rectángulo de búsqueda (search), una línea de cada uno, alternativamente:

    #main-wrap1 {
      width:485px;
      float:$startSide;
      background:$mainBgColor url("http://www1.blogblog.com/rounders/corners_main_bot.gif") no-repeat $startSide bottom;
      margin:15px 0 0;
      padding:0 0 10px;
      color:$mainTextColor;
      font-size:97%;
      line-height:1.5em;
      word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
      overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
      }
    #main-wrap2 {
      float:$startSide;
      width:100%;
      background:url("http://www1.blogblog.com/rounders/corners_main_top.gif") no-repeat $startSide top;
      padding:10px 0 0;
      }

    #sidebar-wrap {
      width:240px;
      float:$endSide;
      margin:15px 0 0;
      font-size:97%;
      line-height:1.5em;
      word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
      overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
      }


  2. En ambos códigos hacemos las soguientes modificaciones:

    En donde está:

    float:$startSide;

    ...lo cambiamos por:

    float:$endSide;

    Y en donde está:

    float:$endSide;

    ...lo cambiamos por:

    float:$startSide;


  3. copiamos el código del sector de las entradas, que es como éste:

      <div id='main-wrap1'><div id='main-wrap2'>
        <b:section class='main' id='main' showaddelement='no'>
    <b:widget id='Blog1' locked='true' title='Entradas del blog' type='Blog'/>
    </b:section>
      </div></div>


  4. Lo pegamos inmediatamente después de este código (puede no ser exactamente igual ya que depende de los gadgets que tengamos en la sidebar):

      <div id='sidebar-wrap'>

        <div id='sidebartop-wrap'><div id='sidebartop-wrap2'>
          <b:section class='sidebar' id='sidebartop'>
    <b:widget id='Followers1' locked='false' title='Seguidores' type='Followers'/>
    <b:widget id='BlogArchive1' locked='false' title='Archivo del blog' type='BlogArchive'/>
    <b:widget id='Profile1' locked='false' title='Datos personales' type='Profile'/>
    </b:section>
        </div></div>

        <div id='sidebarbottom-wrap1'><div id='sidebarbottom-wrap2'>
          <b:section class='sidebar' id='sidebar' preferred='yes'>
    <b:widget id='Attribution1' locked='false' title='' type='Attribution'/>
    </b:section>
        </div></div>

      </div>

    ...eliminándolo del lugar que ocupaba anteriormente, para que no nos dé error por repetición.


  5. Vista previa, guardamos y tendremos la sidebar en el lado izquierdo.