Hey, how's it going. I'm having some issue with the legibility of Heading and Subheading Text over banner images on my pages in The Landscaper. Right now, the text is being placed directly over the image, as a vector image I suppose?
With the right image, this looks excellent. Many times, however, the text becomes illegible over the image being used.
Is there any way to create a background to these images? Essential Grid allows you to place black text on a white background when hovering over an image. Something similar to that would be excellent. I attached examples of what I'm talking about below.
Any help is greatly appreciated. Love this theme - thanks!
This will be possible with some custom CSS. Please add the following via Appearance > Customize > Additional CSS. It will create a dark opacity background for the caption element in the slider:
I have noticed one issue with this. The padding around the text is uneven on the right side and bottom of the text. Adjusting the padding brings the margins in to the left and top of the text, but there's a great deal of white space that remains after I adjust that. I'm not certain why
The padding is currently set to 30px which means all sides will be 30 pixels. If you want to adjust each side individually you can use:
padding: 30px 30px 30px 30px;
The first 30 is for the top, the second for the right side, the third for the bottom side and the last one for the left side. So let's say for example you want to reduce the padding for the right and bottom sides you could use:
I think a great option to add to help avoid this is to be able to better customize position of header photos on pages. Right now we have three options for vertical alignment of header photos - top, bottom and center. In many cases, the header text could become much more legible if the image is *just* moved up or down a little bit. Perhaps an option similar to editing a header in a facebook page that allows you to click and drag? I don't know how involved such a change would be but that would be very, very helpful. Just a thought. Thanks
Thank you for your thoughts and feedback, we love to hear that
The slider support the default cropping function of WordPress. When hovering image you can click the pencil icon in the top right side, a modal will pop-up where you can click the 'edit image' link. On the left side you can click the image and a selection field will appear where you can crop the images. I do need to say that this function could not be available because some servers don't support it or have enabled the module for the code behind this functionality.
I agree that it would be much easier when there is something like the Facebook header editing experience. But we would like to keep our themes as light and fast as possible. Drag and drop functionality will require lots of code which will make it heavier.
But thank you again for your feedback, it's valuable for us and we will take it into consideration.
I have a few other things I'm running into, I hope that's not a problem.
The main navigation menu is almost ready to go. Is there any way to adjust the menu links so that the primary navigation only offers the dropdown options, and doesn't redirect to another page? I've looked through menu settings everywhere and haven't found a way to do this.
This will be possible by adding a "custom link" as primary navigation item. Please navigate to Appearance > Menu's and select the menu you would like to edit from the select field.
On the left side you will see a couple panels where the default "Pages" panel is opened. Please click on the "Custom Link" and add a custom link to the menu structure, set the href input field to # (see screenshot 1).
Drag all the items you would like to have as dropdown under this parent item and save the menu structure. (see screenshot 2).
Hey, how's it going. I'm having some issue with the legibility of Heading and Subheading Text over banner images on my pages in The Landscaper. Right now, the text is being placed directly over the image, as a vector image I suppose?
With the right image, this looks excellent. Many times, however, the text becomes illegible over the image being used.
Is there any way to create a background to these images? Essential Grid allows you to place black text on a white background when hovering over an image. Something similar to that would be excellent. I attached examples of what I'm talking about below.
Any help is greatly appreciated. Love this theme - thanks!
Hi there,
This will be possible with some custom CSS. Please add the following via Appearance > Customize > Additional CSS. It will create a dark opacity background for the caption element in the slider:
/* Add caption background */ .jumbotron.carousel .carousel-text { padding: 30px; background: rgba(0, 0, 0, 0.6); }If you prefer to use a white color opacity background please use the following instead:
/* Add caption background */ .jumbotron.carousel .carousel-text { padding: 30px; background: rgba(255, 255, 255, 0.4); }The slider heading and subheading color can be changed via Appearance > Customize > Theme Options > Slider.
Let me know if you have any questions
Best regards,
Barry
QreativeThemes.com | WordPress Themes
Ah that's cool. I've figured out how to adjust the opacity with it, too. Thank you!
I have noticed one issue with this. The padding around the text is uneven on the right side and bottom of the text. Adjusting the padding brings the margins in to the left and top of the text, but there's a great deal of white space that remains after I adjust that. I'm not certain why
Hi there,
The padding is currently set to 30px which means all sides will be 30 pixels. If you want to adjust each side individually you can use:
The first 30 is for the top, the second for the right side, the third for the bottom side and the last one for the left side. So let's say for example you want to reduce the padding for the right and bottom sides you could use:
Best regards,
Barry
QreativeThemes.com | WordPress Themes
I think a great option to add to help avoid this is to be able to better customize position of header photos on pages. Right now we have three options for vertical alignment of header photos - top, bottom and center. In many cases, the header text could become much more legible if the image is *just* moved up or down a little bit. Perhaps an option similar to editing a header in a facebook page that allows you to click and drag? I don't know how involved such a change would be but that would be very, very helpful. Just a thought. Thanks
Just saw the reply on padding. Thank you for that, too. Would those changes apply to page headers or just the front page carousel?
Thank you for your thoughts and feedback, we love to hear that
The slider support the default cropping function of WordPress. When hovering image you can click the pencil icon in the top right side, a modal will pop-up where you can click the 'edit image' link. On the left side you can click the image and a selection field will appear where you can crop the images. I do need to say that this function could not be available because some servers don't support it or have enabled the module for the code behind this functionality.
I agree that it would be much easier when there is something like the Facebook header editing experience. But we would like to keep our themes as light and fast as possible. Drag and drop functionality will require lots of code which will make it heavier.
But thank you again for your feedback, it's valuable for us and we will take it into consideration.
Best regards,
Barry
QreativeThemes.com | WordPress Themes
That makes sense.
I have a few other things I'm running into, I hope that's not a problem.
The main navigation menu is almost ready to go. Is there any way to adjust the menu links so that the primary navigation only offers the dropdown options, and doesn't redirect to another page? I've looked through menu settings everywhere and haven't found a way to do this.
This will be possible by adding a "custom link" as primary navigation item. Please navigate to Appearance > Menu's and select the menu you would like to edit from the select field.
On the left side you will see a couple panels where the default "Pages" panel is opened. Please click on the "Custom Link" and add a custom link to the menu structure, set the href input field to # (see screenshot 1).
Drag all the items you would like to have as dropdown under this parent item and save the menu structure. (see screenshot 2).
Best regards,
Barry
QreativeThemes.com | WordPress Themes
Perfect, thank you.
You're welcome.
Best regards,
Barry
QreativeThemes.com | WordPress Themes