-
Posts
-
Hi,
I would like to have a header like the image. It this possible? And how can I create this.
Thanks in advance.
Anne-lys
Hi Anne-lys87!
Hmm, it looks like your trying to create three columns with text and a checkmark icon to the left of the text?
You can do this with our column and icon box elements.
Regards,
ElliottHi Elliott,
Thanks for answer. I want to like this columms with icons standard in header. So on each page. Is there a code I can use to have this automaticly?
Hey!
Please refer to this post to add a widget area to your header – http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/
You can enable debugging mode to see shortcodes you have created in pages using Advanced Layout Builder – http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/
Or, You can switch to Default Editor and click on Magic Wand to see full list of shortcodes http://i.imgur.com/n4KXkdm.jpg
then you can create any of them and copy/paste shortcode into any other content element or into text widget.Cheers!
YigitHi,
I created the header as I wanted, thanks for your support. Only thing is that when I will check the website on a tablet of phone this text is not displayed in a beautiful line or below each other. How can I create this?
Thanks in advance.
The website is http://www.subdomein.lichtsinnich.nl
Hi,
I could only see what I thing is a coming soon page, do we need to be logged in to see your content? If so please post details in private. A screenshot highlighting what you are trying to achieve might help as well.
Best regards,
RikardHey!
refrain from bumping into your own thread, as it pushes it behind in our queue and marks it as answered and then we can’t provide a faster reply to you.
You are using a header widget for this, right? I would build two instead, one version for mobile only which you can hide on desktop and vice versa. Hope this helps. Turn on custom class: kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
Best regards,
AndyHi Andy,
Thanks for answer. I am using the header as a widget, that’s right.
I added the next line to functions.php
add_theme_support(‘avia_template_builder_custom_css’);and created a next widget ‘header mobile’.
After I added the line to functions.php I found the Custom Class field in the template builder. But I can not add any Custom Class field in the widget. After that, I added the next code in functions.php:
@media only screen and (max-width: 600px){
add_action( ‘ava_after_main_menu’, ‘enfold_customization_header_widget_area’ );
function enfold_customization_header_widget_area() {
dynamic_sidebar( ‘header mobile’ );Meaby I could create a widget only for mobile, but after adding this code I’ve got the internal error 500 for this website.
This things where not helping. Do you have the answer to have this on a good way?
Thanks in advance.
Anne-lys
Hi!
the code you are using is wrong. Here is a tutorial for adding header widget: kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/
Regards,
AndyHi Andy,
Thanks for answer.
That code I am using for the widgets. The code I said, I am only using for the option to have the widgets good for the mobile or tablet screen. In the images I presented in an older post you can see that the widget aren’t good at the mobile and tablet. After that, I tried to make two instead, one version for mobile only which you can hide on desktop and vice versa. That’s the reason I put another code. But that is not working.The version for desktop is okey. Now I would like to have this okey on a mobile or tablet screen.
Greetz, Anne-lys
Hi!
I think you should try another approach. Put this into your header widget instead:
[av_one_third first min_height='' vertical_alignment='' space='' custom_margin='' margin='0px' padding='0px' border='' border_color='' radius='0px' background_color='' src='' background_position='top left' background_repeat='no-repeat' animation=''] [av_textblock size='' font_color='' color='' custom_class=''] √ Al meer dan 30 jaar uw lichtontwerper [/av_textblock] [/av_one_third][av_one_third min_height='' vertical_alignment='' space='' custom_margin='' margin='0px' padding='0px' border='' border_color='' radius='0px' background_color='' src='' background_position='top left' background_repeat='no-repeat' animation=''] [av_textblock size='' font_color='' color='' custom_class=''] √ Merkonafhankelijk advies [/av_textblock] [/av_one_third][av_one_third min_height='' vertical_alignment='' space='' custom_margin='' margin='0px' padding='0px' border='' border_color='' radius='0px' background_color='' src='' background_position='top left' background_repeat='no-repeat' animation=''] [av_textblock size='' font_color='' color='' custom_class=''] √ Fotorealistische lichtpresentatie in Dialux Evo [/av_textblock] [/av_one_third]And then you can style it using this css code inside your Quick CSS field:
#text-10 .textwidget .avia_textblock p { color: green; position: relative; top: 53px; }Then it will work on mobile too and/or it will be much easier to adjust it for mobile.
Regards,
AndyHi Andy,
Thanks for answer. It is almost how I want. The only thing is the big space between the menu and the words, like the image. The code you said for the Quick CSS must be #6 instead of #10.
[IMG]http://i65.tinypic.com/sdojl1.png[/IMG]Thanks in advance
Hi Andy,
You can forget it what I said, I solved the problem. Now it is like you can see on the image.
The only thing is de space between the text widget and the text of the page. I want to have the normal space between the menu and the other text of the space.
Sorry, that I’ll be back again. The title and breadcrumbs are gone now on the desktop screen. On the mobile they will come back.
Hey!
I checked page in private content and your big header is caused by your Header settings in Enfold->Header->Header Layout->Header Size->”large”
Change it to “slim” or “custom pixel” and adjust as needed.Breadcrumbs should show up if your header is smaller.
Regards,
AndyHi,
Sorry, but I tried all of the settings at the header and also differtent pixels at custom pixel. The title of the page in not coming back.
Like on the image, the header is taking the same space in code, also I made it smaller.
Hey!
your changes of header height are not visible for you? if that’s the case then it’s might be because you haven been using a caching Plugin, so activate it again, go into plugin’s settings and choose to switch off caching. Deactivate this and all other plugins. Afterwards clear browser cache and hard refresh a few times.
Best regards,
AndyHi,
Do you see the titel and breadcrumbs of the page when you logged in? The caching Plugin I removed and I refreshed my internet a few times It is something in the theme I think. Like you can see in the image of my text previously, the header is taking a big part of the page, even I made the header smaller. So on this reasen the titel is not visible.
Please help me to get the title back. Please do not say that I switch off my plugins, how I can create the title or make the header smaller. That are thinks I know.
Greets.
Hi!
I changed header pixel height in your Enfold’s header height. Then I added this code at the bottom of your Quick CSS field:
/* kriesi custom code */ #top .title_container .container { padding-top: 100px; } #text-6 { padding-top: 0px; top: 78px; }and now it seems to be fine for me. Can you confirm please?
Cheers!
AndyHello,
I am so happy that it is good now, thank you. The only thing that would be resolved is the space between the header and the tekst on mobile, like in de image I attached. How can I create less space here?
Thanks in advance.
- You must be logged in to reply to this topic.