Flexslider y compatibilidad de idioma de derecha a izquierda

Question

Instalé una plantilla en WordPress que contiene Flexslider. Mi idioma está escrito de derecha a izquierda (RTL). Cuando la página es RTL, el Flexslider se detiene y no aparecen imágenes. ¿Cómo puedo resolver este problema?

Answer 1

El control deslizante flex no es compatible con los idiomas rtl. La única manera de solucionarlo es hacer que el div que sostiene el deslizador direction: ltr

1. del tema, si el control deslizante en la página principal de encontrar un archivo llamado index.php encontrar el div que está sosteniendo el control deslizante y todo esto código style="direction:ltr;" esto mostrará sus artículos sobre el Slier perfectamente

2. para fijar la dirección del texto de RTL encontrar un archivo llamado flexslider.css en su tema y en la línea de explotación, el código .flexslider .slides > li{ (línea # 25 para mí) Incluir este :
   text-align:right;
direction:rtl;

Estos pasos de remolque lo arreglaron por mí. Buena suerte

Answer 2

La respuesta de Fatma no funciona para mí. Lo que funciona es la modificación de la .flex-viewport estableciendo direction: ltr:

.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; direction: ltr; } 

Answer 3

Para el montaje de la navegación direccional, estas reglas en su propia hoja de estilo deben anular las reglas de flexslider:

/* Flexslider RTL */ 
.flex-direction-nav .flex-next {background-position: 0 0; left: -36px; right: auto;} 
.flex-direction-nav .flex-prev {background-position: 100% 0; right: -36px; left: auto;} 
.flexslider:hover .flex-next {left: 5px; right: auto;} 
.flexslider:hover .flex-prev {right: 5px; left: auto;} 
@media screen and (max-width: 860px) { 
    .flex-direction-nav .flex-prev {opacity: 1; right: 0; left: auto;} 
    .flex-direction-nav .flex-next {opacity: 1; left: 0; right: auto;} 
} 

Answer 4

necesita cambiar tanto JS y CSS para ello trabajar. Afortunadamente no requirió mucho trabajo. Bifurqué el proyecto y agregué el soporte al https://github.com/layalk/FlexSlider/tree/rtl. Darle una oportunidad.

Answer 5

utilicé reverse:true, en flexslider() función y el control deslizante funcionaba en dirección opuesta a la predeterminada.

Y

.flexslider .slides li{ 
    direction: ltr; 
} 

que trabajó para mí.