Docs

[liz80y]

Hi there,

I have a few problems that i’m struggling with and was wondering if you would be able to help me.

1. I have recently created another blog post (‘Fuel Costs and overall budget’ under Planning 101 menu) and it isn’t appearing in the slider at the top of the Planning 101 category or the ‘Recent Posts’ section of my homepage.

2. My main menu and logo is not center aligned correctly. It is slightly to the left. They are two separate elements, is there anyway of moving them both so it sits perfectly in the middle of the page?

3. On my homepage slider i have placed a image credit on the bottom right hand corner. It looks perfect on my large monitor, but on the laptop and mobile it is further up the slider and doesn’t look correct. Can we make it stay in the same position as the large monitor? See attached image of large screen and then mobile.

4. One of my homepage slider images (see attached pic) under has a text overlay ‘Living Life’ with a black transparent background. The background isn’t appearing like it does on all the other slides. Can you tell me why? I’ve tried everything i can think of.

5. On the homepage under ‘In the spotlight’ The headings for the three promo elements look great on the large monitor but again, on the laptop and mobile they are too big. I can’t see how to make the headings a smaller size. Can you help?

I’m sorry there are so many things. If you can assist with any, i’d be very thankful.

Thanks 🙂

[liz80y]

This reply has been marked as private.

[Joao]

Hi There,

1 – Your recent posts is following exactly the published order of your posts according to:

http://outbackandbushaustralia.com/wp-admin/edit.php

You can change the publish date of your post to a more recent date in case you want it to be shown, just click on the option “Quick Edit” on the specific post on the page above.

2- I can´t see what you are referring to, would you mind providing a screenshot of the issue.

3- Your text was position half outside of the slider grid, I have re-positioned the text o the first slider and now it appears on all devices properly, follow the example for your other layers.

4- For some reason even if you could see the background color on Slider Revolution, once I explored the Style settings of your layer the background color was set to transparent. I have changed to black.

5- Please add the following code to Appereance Customizer Custom CSS and adjust the size according to your wishes:

@media (max-width:979px) {
.x-promo-content {
    font-size: 10px !important;
  } }

Please provide us more details about item 2 let us know if you need help with anything else.

Thanks

Joao

[liz80y]

Thank you Joao,

1. Worked great

2. Please find attached image of main menu at top of homepage (nav bar?). The ubermenu and the logo both sit to the left of the page. I would like it to be centered.

3. The text may have been slightly out of the grid in order for it to appear exactly in the bottom right hand corner (when designing the page on my large monitor). Now there is no credit visible on both the large monitor or the laptop but i can see it when viewing on the mobile. I’d just like to have it placed in the bottom right corner and it to be in the same spot regardless of the technology it is being viewed on.

4. All fixed!

5. Didn’t make any difference unfortunately. Nothing changed.

Thanks again 🙂

[Friech]

Hi There,

#2 You can add this under Custom > CSS in the Customizer.

@media (max-width:  979px) {
	.x-navbar-inner > .x-container {text-align: center;}
	.ubermenu-responsive-toggle {display: inline-block;}
	a.x-brand.img {
	float: none;
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
	}
}

#3 Follow this (see screenshot) settings for those credit layers.

http://image.prntscr.com/image/4f20e01bd55d419b89d3a1797395c6e7.png
http://image.prntscr.com/image/f786114779b44724b2804039bfda03c4.png

#5 On your Cornerstone > Settings > Responsive, define a Responsive Text settings. Then apply the selector of your responsive text as the class for those headlines. Play with the compression, min_size, & max_size value until you get the desired result.

Hope it helps, Cheers!

[liz80y]

Thanks,

#2 Unfortunately it didn’t work. It also started to make my menu go weird and disappear when viewing the homepage and reappear again once in customizer so i didn’t keep the css in there.

#3 I did as you suggested and it worked perfectly for my mobile (see attached 2nd image) but my large monitor and laptop don’t show the text at all (1st attachment). It seems to be below the margin.

Also, you will notice from the attached pics that when viewing the slider on the larger screens the text overlay for the slide headings (e.g. Enjoying Experiences) is quite small and compact but when viewed on a mobile (as displayed in the 2nd attachment) it is huge and runs off the screen. Is there a way of making this uniform also?

#5 I’m still trying to understand what to do, will get back to you after i figure it out 🙂

Thanks heaps for your patience.

[liz80y]

Try second attachment again

[Rue Nel]

Hello There,

Thanks for the updates!

#2] To center your logo and menu on desktop screens, please find and update your css code and use this instead:

@media (min-width: 980px){
  .x-brand {
    float: left;
    margin-left: 50px;
  }
}

#3] On larger screens, you have added a custom css that limits the maximum height of the slider. You need to remove this code:

.home .x-slider-container.below {
    max-height: 540px !important;
}

Hope this helps. Please let us know how it goes.

[liz80y]

Thanks,

#2 I have added the changed CSS and the menu has reverted back to being almost invisible on the homepage again. If you look at attachment (no credit) you will see how the menu is supposed to look whereas the second attachment (menu after) is what it looks like now. Also, the ‘Blog’ menu item has been stretched so there is now a gap. I would like it to look uniform if possible.

#3 You will also see from the attachment (menu after) how the homepage slider looks like on the large screen and laptop. This is AFTER i removed the code. So it didn’t make any difference.

Thanks for your help 🙂

[liz80y]

In regard to my other problem..

#5. On the homepage under ‘In the spotlight’ The headings for the three promo elements look great on the large monitor but again, on the laptop and mobile they are too big. I can’t see how to make the headings a smaller size. Can you help?your directions below…

and the response…

“#5 On your Cornerstone > Settings > Responsive, define a Responsive Text settings. Then apply the selector of your responsive text as the class for those headlines. Play with the compression, min_size, & max_size value until you get the desired result.”

I am really confused. I’m not sure what to put in the Selector section. I have changed the first promo element (Organisation) to the class “responsive_text”, but not clear on what to do after that in regards to the Cornerstone > Settings > Responsive > selector section.

[Rue Nel]

Hello There,

Thanks for the updates!

#2] Please also add this code in your customizer;

.site .ubermenu .ubermenu-nav .ubermenu-column-1-5 {
    width: auto; 
}

#3] The code controls the height of the slider. I am puzzled why it affects the menu wherein it shouldn’t do any effects in your site.

#5] If you want to apply responsive text in the promo content, you use this class .x-promo-content h5 as the selector.

Hope this helps.

[liz80y]

Excellent!

#2 All fixed

#3 Disregard anything to do with the menu now – That’s fixed. The main thing i’m wanting to figure out is why the image credit appears on the bottom right hand corner when viewing on the mobile, but it’s not showing on a laptop or larger screen. I have tried all the previous suggestions and nothing changes. Do you have any other ideas?

Also, you will notice from the attached pics that when viewing the slider on the larger screens the text overlay for the slide headings (e.g. Enjoying Experiences) is quite small and compact but when viewed on a mobile (as displayed in the 2nd attachment) it is huge and runs off the screen. Is there a way of making this uniform also?

#5 Fixed too. You’re wonderful!

Thanks so much 🙂

[liz80y]

Sorry, i now have a large gap between my homepage slider and my content below. Can you also tell me how to ring my content on the homepage up to meet the slider above?

Thank you.

[Christopher]

Hi there,

#3 Following code has limited slider height, please find and edit it :

.rev_slider .tp-bgimg.defaultimg {
    background-position: center center !important;
    max-height: 500px;
}

Please find and edit this code :

@media (max-width: 480px){
.tp-caption.Fashion-BigDisplay, .Fashion-BigDisplay .tr-bg {
    font-size: 33px !important;
}
}

Hope it helps.

[liz80y]

That’s great!

All fixed. You’ve been so helpful.

Thank you 🙂

[Author]

Posts