Estoy desarrollando un sitio web usando wampserver en localhost y estoy tratando de ver mi sitio en un dispositivo móvil en mi red local.
Cambié la URL de inicio y del sitio en Settings > General de
Para
También utilicé el complemento URL velvet blues para actualizar mis imágenes, etc. desde localhost a mi ip.
Todas mis imágenes en mi sitio se mostrarán en dispositivos móviles, excepto las imágenes de la fila de fondo de la página de inicio. He comprobado la URL en las herramientas de desarrollo de Chrome y la ruta de la URL es la misma que la de las imágenes que se muestran. No sé cómo proceder.
Cualquier ayuda sería excelente.
Comentarios
- Eso ' s extraño. ¿Quieres decir que las URL son válidas, pero no se muestran?
- Sí. Revisé la ruta de la URL y es la misma. La única diferencia es que Lo que puedo ver es que las imágenes que se muestran son etiquetas img y las que no se muestran son imágenes de fondo, es decir, que se muestran use < img src = " ip / site / wordpress / wp-content / uploads / 2017/06 / image.jpg " > pero no se muestran background-image: url ( ip / site / wordpress / wp-content / uploads / 2017/06 / image. jpg ). ¿Es posible que la imagen de fondo esté causando un problema incluso si la URL es correcta? Gracias.
Respuesta
Las rutas relativas actúan de manera diferente cuando se utilizan en un archivo CSS. El comportamiento sigue siendo el mismo y la ruta sigue siendo relativo, pero para un ser humano puede parecer confuso.
Cuando usa una ruta como esta para su imagen:
<img src="/path/image.jpg"/> El navegador buscará dentro de path carpeta, ubicada en la raíz de la web actual. Pero cuando usas el mismo valor dentro de tu CSS:
background-image: url( "/path/image.jpg" ); La historia es diferente. El navegador buscará dentro de la carpeta path, según la ubicación de la hoja de estilo , no la URL actual. Por lo tanto, si la hoja de estilo se encuentra en:
www.example.com/wp-content/themes/twentyseven/ Entonces el navegador buscará:
www.example.com/wp-content/themes/twentyseven/path/image.jpg Lo cual no existe. Por lo tanto, es importante crear sus rutas CSS en relación con la ruta de la hoja de estilo.
Para una mayor comprensión, eche un vistazo aquí .
Comentarios
- Solo para aclarar: if url de imagen de fondo ( ip / site / wordpress / wp-content / uploads / 2017/06 / image.jpg ) y mi hoja de estilo está en C: \ wamp64 \ www \ site \ wordpress \ wp-content \ themes \ theme \ style.css ¿Necesito crear una ruta de archivo C: \ wamp64 \ www \ site \ wordpress \ wp-content \ themes \ theme \ site \ wordpress \ wp-content \ uploads \ 2017 \ 06 \ image.jpg ?
- No. Primero, ingrese
ip/site/wordpress/wp-content/uploads/2017/06/image.jpgen su navegador y vea si se abre. Si lo hizo, es posible que desee ajustar la URL en''comobackground-image url('URL')o agreguehttp://antes deip. - I p Ut esa ruta en un navegador y se abre. En las herramientas de desarrollo tiene http: // antes de la ip pero no está entre comillas. A pesar de la falta de citas, las imágenes de fondo se muestran en mi sitio web localhost pero no en el móvil. Gracias.
Respuesta
El problema no era con img src o url de la imagen de fondo, era con Apache y el cortafuegos. Todavía no estoy seguro de por qué, pero cuando cambié el archivo http.vhosts.config y actualicé el servidor wamp y luego desactivé la configuración del cortafuegos para Wamp, las imágenes se pueden ver. Si lo hice al revés, cambiando el firewall y luego Apache, las imágenes no se podían ver.