Layouts not working

dans_off · September 2015

Hello,

I want to put a different background to some pages in order to realize something like this:

I tried to use Layouts function, but it doesn't work: on my first attempt, I succeed to create a layout, but it didn't show the background image.

After, I created other ones, but when I tried to preview them I only received a 404 page error, both as a draft and as a published layout.

Can you explain me the best way to achieve my goal or how can I solve this layouts function error?

I've already tried to search a solution on your forum, but there are too many entries!

Other information, if them can be useful:

I'm using BT Child theme;

my CSS customizations are:

----

#Top_bar #logo {

height: 90px;

padding: 0px 0px;
}

body:not(.template-slider) #Header {

min-height: 90px;
}

@media only screen and (max-width: 767px)
body:not(.template-slider) #Header {
min-height: 90px;
}

#Top_bar .menu > li > a span:not(.description) {
line-height: 53px;
}

.header-split #Header .top_bar_left .menu_left {
float: left;
width: 40%;
text-align: left;
}

.header-split #Header .top_bar_left .menu_right {
text-align: left;
}

@media only screen and (max-width: 1239px)
#Top_bar a.responsive-menu-toggle i {
font-size: 40px;
line-height: 35px;
}

body:not(.template-slider) #Content {
padding-top: 0px;
}

.pager {
background-color: white;
margin-bottom: 40px;
padding: 20px;
}

.image_frame:not(.no_link) .image_wrapper img:not(.ls-l) {
margin-bottom: 0px !important;
}

.post-item {
background-color: white;
margin-bottom: 0px;
}

.with_aside .four.columns {
margin-top: 20px;
}

----

Thank you in advance,

Daniele

Albert · September 2015

Hi,

please show us on screenshots what errors you got because we do not understand. Please notice that all 404 errors are not related with theme at all so if you got 404 error, it must be something else wrong.

dans_off · September 2015

Hi,

here they are:

Albert · September 2015

You must misunderstood something probably

When you click "Preview changes" button, you won't see anything because this is not a standard type of page or post. This button for "Layouts" simply does not work. If you want to check how layout looks like, you must set this layout for page (for each page under "Page options" you have an option to select layout). This is the only way to preview the layout for page.

dans_off · September 2015

OMG, sorry. Spending hours on a project makes us crazy :-S It was simple!

Thank you!

dans_off · September 2015

OK, now layout works fine! :-)

But I have a question: is it possible to do something similar to the first screenshot I attached before, using a "full-width" Top Bar with menu and then a "boxed" body for the rest of content, to show the background image?

It seems not :-(

Many thanks!

Albert · September 2015

If you will set boxed layout for page then you can send us url to this page and we can check if it is possible to be done with custom css.

dans_off · September 2015

Thank you so much, I found a partial solution but it works only at full-width resolution (1920px).

I create a full-width layout, setting the background image, logo and header style.

Then I put this custom css in page:

---

#Content {

width: 1280px;
margin-left: 320px;
margin-bottom: 150px;
}

#Wrapper {
background-color: transparent;
}

---

It works perfect at 1920px, but due to "margin-left" setting it is going to broke when you reduce browser width.

Maybe, can it be better to set a boxed layout and then to increase the Header width?

Can you suggest me the right way to do that, without responsive issues, please?

Now the website is in Mantenaince Mode. I don't want to go online, but I'll willing to do it if that's what it takes. Thank you!

Albert · September 2015

We need to have a look on website and only then we'll be able to tell you if this can be fixed or not.

Layouts not working

Comments