-
Posts
-
Hi,
I would like to add a background image while using fixed layout, is there any way to do it?
I can see there’s a background image option while using the boxed layout, the option disappears when i’m using the fixed layout.
for example: http://kriesi.at/themes/enfold-resume/ (i want to change the gray background to my own background image)plus, if that is possible to add the background image, is there any way to change the whole fixed layout to slightly transparent?
I don’t know about coding, please help!Thanks!
Hey Kadence,
Yes, this should be possible via css. Please provide a link to the site in question so we can inspect it and begin to help you further.
Best regards,
Jordan ShannonHi,
Please try this in Quick CSS, add the URL to your image first:
.html_av-framed-box { background-image:url(https://yoursite.com/yourimage.jpg); }Best regards,
RikardHi,
It looks like that section on your site is composed of two sections with their own background color rule. What kind of background image are trying to use? If it is a pattern it should work seamlessly. If it is more intricate, it could prove more difficult. Also, be sure to load the background image to the media library first.
Best regards,
Jordan Shannonoh ok, i leave the background color empty, now it shows the image. But the image keeps repeating and the fixed layout became boxed layout style. i would like to use a stretched to fit image background, stay still and full screen. And the fixed layout main content and menu to be 0.8 transparent. like this http://www.xinrongji.cc/index.php/about/index.
Thank you for helping me out.
Hi,
Add the following to quick css to make a full background image, but you need to put the main section back in a fixed height frame for the style to look good beacause the image needs to stay proportioned:
.html_av-framed-box { background-image: url(//kymera.hk/sir3/wp-content/uploads/2017/07/罗湖店贵宾房.jpg)no-repeat center center fixed; /* Full height */ height: 100%; /* Center and scale the image nicely */ background-position: center; background-repeat: no-repeat; background-size: cover; }Best regards,
Jordan ShannonThanks Jordan, the image doesn’t repeat now, thanks! but I did set the General Layout to Fixed frame, it doesn’t work, just keep showing me scrolling down version (similar to boxed layout). And can i set the frame border thicker? (now the maximum is 75px.) and is there any way the frame can be transparent 0.8?
Hi,
Can you re-trace your steps to set it back to the fixed frame as you had it before?
Best regards,
Jordan ShannonI only add the code that you provide,
.html_av-framed-box {
background-image:url(http://kymera.hk/sir3/wp-content/uploads/2017/07/罗湖店贵宾房.jpg);no-repeat center center fixed;
/* Full height */
height: 100%;/* Center and scale the image nicely */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}I tried to take out the code from quick css, the layout didn’t switch back to fixed frame, unless i import the CV demo again.
Hi,
Apologies for the delay in my response. Looking into this issue further, I now see what the problem is. When the site is set to fixed frame it is essentially surrounded by four separate classes to box it in. Each class is treated as its own entity with its own height, width, background, etc. So unfortunately having one single background image would not work. The only workaround would be to try and cut the image to fit each portion of the frame so that it appears as one to visitors.
Best regards,
Jordan Shannon
- You must be logged in to reply to this topic.