Estou desenvolvendo um site usando wampserver no localhost e estou tentando visualizar meu site no celular na minha rede local.
Mudei o URL da página inicial e do site em Settings > General de
Para
Eu também usei o plug-in de URL velvet blues para atualizar minhas imagens etc. de localhost para meu ip.
Todas as imagens do meu site serão exibidas no celular, exceto as imagens da linha de fundo da página inicial. Eu verifiquei o URL nas ferramentas de desenvolvedores do Chrome e o caminho do URL é o mesmo das imagens que estão sendo exibidas. Não sei como proceder.
Qualquer ajuda seria ótima.
Comentários
- Isso ' é estranho. Quer dizer que os URLs são válidos, mas não são exibidos?
- Sim. Verifiquei o caminho do url e ele é o mesmo. A única diferença é podemos ver é que as imagens que estão sendo exibidas são tags img e as que não são exibidas são imagens de fundo, ou seja, as exibidas usam < img src = " ip / site / wordpress / wp-content / uploads / 2017/06 / image.jpg " > mas não exibidos são background-image: url ( ip / site / wordpress / wp-content / uploads / 2017/06 / image. jpg ). A imagem de fundo pode estar causando um problema, mesmo se o url estiver correto? Obrigado.
Resposta
Os caminhos relativos agem de maneira diferente quando são usados em um arquivo CSS. O comportamento ainda é o mesmo, e o caminho ainda é relativo, mas para um humano pode parecer confuso.
Quando você usa um caminho como este para a sua imagem:
<img src="/path/image.jpg"/> O navegador irá olhar dentro do path pasta, localizada na raiz da web atual. Mas quando você usa exatamente o mesmo valor dentro de seu CSS:
background-image: url( "/path/image.jpg" ); A história é diferente. O navegador procurará dentro da pasta path, com base na localização da folha de estilo , não no URL atual. Portanto, se a folha de estilo estiver localizada em:
www.example.com/wp-content/themes/twentyseven/ O navegador procurará:
www.example.com/wp-content/themes/twentyseven/path/image.jpg Que não existe. Portanto, é importante construir seus caminhos CSS em relação ao caminho da folha de estilo.
Para um melhor entendimento, dê uma olhada em aqui .
Comentários
- Só para esclarecer: if url da imagem de fundo ( ip / site / wordpress / wp-content / uploads / 2017/06 / image.jpg ) e minha folha de estilo está em C: \ wamp64 \ www \ site \ wordpress \ wp-content \ themes \ theme \ style.css preciso criar o caminho do arquivo C: \ wamp64 \ www \ site \ wordpress \ wp-content \ themes \ theme \ site \ wordpress \ wp-content \ uploads \ 2017 \ 06 \ image.jpg ?
- Não. Primeiro, digite
ip/site/wordpress/wp-content/uploads/2017/06/image.jpgem seu navegador e veja se abre. Se abrir, você pode envolver o URL em''comobackground-image url('URL')ou adicionehttp://antes deip. - I p ut esse caminho em um navegador e ele abre. Nas ferramentas de desenvolvimento, ele tem http: // antes do ip, mas não está entre aspas. Apesar da falta de citações, as imagens de fundo são exibidas no meu site localhost, mas não em dispositivos móveis. Obrigado.
Resposta
O problema não era com o img src ou url da imagem de fundo, era com o Apache e o firewall. Ainda não tenho certeza do porquê, mas quando mudei o arquivo http.vhosts.config e atualizei o servidor wamp e desativei as configurações do firewall para o Wamp, as imagens podem ser visualizadas. Se eu fizesse o contrário, alterando o firewall e depois o Apache, as imagens não eram visíveis.