Images link lost after upgrade

[RPronk]

Hello, as soon as I upgrade my site www.jitty.nl all image links and other stuff does not function anymore. I have a testing domain https://jittysamsterdam.com where you can see the issue.
Let’s start with the missing header image. There is a media query which points to the images. The images are online. This is the css

$el.x-section{

padding-top: 175px;

padding-bottom: 130px;

background-color: #000;

}

$el .x-bg{

background: url(/wp-content/uploads//Goede-kapper-Amsterdam-voorpagina-1925.jpg);

background-size: cover;

background-repeat: no-repeat;

background-position: center;

top: 60px;

height: calc(100% - 60px);

}

@media only screen and (max-width:1199px){

$el.x-section{

padding-top: 120px;

padding-bottom: 100px;

}

$el .x-bg{

background: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45) ), url(/x§);

background-size: cover;

background-repeat: no-repeat;

background-position: center;

}

}

@media only screen and (max-width:979px){

$el.x-section{

padding-top: 100px;

padding-bottom: 80px;

}

$el .x-bg{

background: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45) ), url(/wp-content/uploads/Goede-kapper-Amsterdam-979.png);

background-size: cover;

background-repeat: no-repeat;

background-position: center;

}

}

@media only screen and (max-width:767px){

$el.x-section{

padding-top: 100px;

padding-bottom: 50px;

}

$el .x-bg{

background: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45) ), url(/wp-content/uploads/Goede-kapper-Amsterdam-767.png);

background-size: cover;

background-repeat: no-repeat;

background-position: center;

top: 0px;

height: 100%;

}

}

@media only screen and (max-width:480px){

$el.x-section{

padding-top: 100px;

padding-bottom: 10px;

}

$el .x-bg{

background: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45) ), url(/wp-content/uploads/Goede-kapper-Amsterdam-480.png);

background-size: cover;

background-repeat: no-repeat;

background-position: center;

}

}

It works fine on the old site, as soon as I upgrade to newer version of PRO this does not work anymore.

Secondly images on the middle of the page also does not show and I have other issues with sidebars. Sorry to have to many issues at once.

I think it would be wise the upgrade individual elements of the site to newer elements. But before I will do that let’s see if we can fix the major issues.

Thanks,
Ronald

[prakash_s]

Hello @RPronk,

Thanks for writing to us.

It seems that the URLs are not fully replaced while moving the site from staging to productions or from HTTP to HTTPS and that causes the Mixed Content issue [ HTTP and HTTPS ] blocking to load image files.

I would suggest you replace the URL properly and check this again, there are many URL replacement Plugins available in WordPress which help you to replace the URL.

This article will be helpful in this:https://www.wpbeginner.com/plugins/how-to-update-urls-when-moving-your-wordpress-site/

Also, remember that the exact URL should be mentioned in Setting > General, WordPress Address and Site URL, including the protocol i.e HTTP/HTTPS.

Hope this helps.
Thanks

[RPronk]

i am sorry not to give you a correct question. On my site www.jitty.nl as soon as I update PRO the EXACT same issue occurs. I will run the re name plug ins on both sites and let you know what happens
Thanks!

[prakash_s]

Hello @RPronk,

Please let us know how it goes.

Thanks

[RPronk]

Hello, I have run better search and replace plug in and replace all http with https Also changed adres in site. Still header image is not showing. I am not an expert in code, but in my browser is see the link https://jittysamsterdam.com/wp-content/uploads/Goede-kapper-Amsterdam-1199.png which is the correct link. But it does not show. The links comes from above media query.

Some other issues on sites I have allready identified. I hope we can find the issues with the header.

Thanks

[RPronk]

found it, had to activate again background image in the background layers.

All i all i will need to check the complete site for some issues. Thanks for now!

[ruenel]

You are always welcome.