¿Cómo mover la barra lateral en TwentyFifteen a la derecha?

Navega tus respuestas
14

¿Es posible mover la barra lateral en el tema TwentyFifteen a la derecha usando solo un tema secundario y CSS, o requiere cambios en el tema en sí? El problema principal con el que me estoy topando es que puedo colocar la barra lateral en el lado derecho, ya sea en el escenario "predeterminado" o "desplazado", pero no en ambos (la posición predeterminada usa la posición: relativa y es lo que obtienes cuando la página cargas, el desplazamiento se establece cuando la página se desplaza y cambia la posición de la barra lateral a absoluta.)

    
pregunta Anteru 02.01.2015 - 17:20

4 respuestas

6

Tomé lo siguiente del rtl.css y lo apliqué a través de Magic Widget con !important palabras clave adicionales para un sitio en inglés: 

body:before {
    right: 0 !important;
    left: auto !important;
}
.sidebar {
    float: right !important;
    margin-right: auto !important;
    margin-left: -100% !important;
}
.site-content {
    float: right !important;
    margin-right: 29.4118% !important;
    margin-left: auto !important;
}
.site-footer {
    float: right !important;
    margin: 0 35.2941% 0 0 !important;
}

Esto parece funcionar, incluso cuando se desplaza hacia abajo.

    
respondido por el fuxia 02.01.2015 - 19:39
4

Puede agregar el código siguiente al tema de su hijo. 

@media screen and (min-width: 59.6875em) {
    .site-content {
        float: left;
        margin-left: 0px;
        width: 70.5882%;
    }   
    .sidebar {
        float: right;
        right:0;
        margin-right: 0px;
        max-width: 413px;
        width: 29.4118%;
    }   
    body:before {
        right: 0;
        left:auto;
    }       
    .site-footer {
        margin: 0 0 0 6.1%;
    }
}
    
respondido por el amolveer 06.02.2015 - 13:00
1

La solución aceptada rompe la capacidad de respuesta del tema cuando se usa desde un móvil. Tuve que envolver la solución aceptada por toscho y Anteru en un @media screen como la plantilla original de veinte y quince. 

@media screen and (min-width: 59.6875em) {
  body:before {
    right: 0 !important;
    left: auto !important;
  }

  .sidebar {
    float: right !important;
    margin-right: auto !important;
    margin-left: -100% !important;
  }
  .site-content {
    float: right !important;
    margin-right: 29.4118% !important;
    margin-left: auto !important;
  }
  .site-footer {
    float: right !important;
    margin: 0 35.2941% 0 0 !important;
  }

  body { direction: rtl; }
  .sidebar, .site-content, .site-footer { direction: ltr; }
}
    
respondido por el Augusto 06.12.2015 - 12:23
0

Recientemente extendí un tema infantil a partir de consejos y trucos para el tema de las veinticuatro y pensé que debería compartir cómo pueden mover la barra lateral hacia la derecha con ustedes. en el tema secundario extendido quité la barra lateral completamente del tema de los veinte y quince, ya que algunas personas prefieren usarlo de esa manera. Puede descargar el tema secundario aquí y cambiar el código para restaurar la barra lateral a la derecha:

Cambia el siguiente código: 

.sidebar {
    float: none !important;
    margin-right: 0px;
    max-width: 413px;
    position: relative !important;
    width: 29.4118%;
    background: #fff;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
    display: none;
}

a 

.sidebar {
    float: right;
    margin-right: 0px;
    max-width: 413px;
    position: relative !important;
    width: 29.4118%;
    background: #fff;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
}
    
respondido por el Djouonang Landry 06.08.2015 - 18:49

Lea otras preguntas en las etiquetas

Guardar términos de taxonomía ¿Reescribiendo un enlace permanente de tipo personalizado con un término de taxonomía?