Tagged: custom taxonomy, transparent header
-
AuthorPosts
-
March 17, 2015 at 12:09 pm #412874
Hi Kriesi!
I am creating a taxonomy-{taxonomyName}.php file, because I would like to change the way this taxonomy is displayed.
I would like to assign the transparent header to the page, but I do not know how to give to get_header() an argument to choose the right transparent header.
Could you help me, please?
Thank you so much.Riccardo
March 17, 2015 at 6:51 pm #413166Hey Mercheric!
Send us a link to your page and we’ll give you some CSS to use.
Best regards,
ElliottMarch 18, 2015 at 11:36 am #413523This reply has been marked as private.March 19, 2015 at 5:00 pm #414628Hi!
Sorry but that would not be possible. Send us a link when you go live and we’ll be able to help you out.
Regards,
ElliottMarch 19, 2015 at 5:03 pm #414634OK. that’s a pity.
Thank you anyway.Riccardo
March 20, 2015 at 8:19 am #415092Hey!
We’ll keep the thread open. Let us know once the site is live. A screenshot will help.
Cheers!
IsmaelApril 3, 2015 at 9:00 am #422930Here we are again. The website is online: twinmotion.com
As I wrote before, I would like to put the transparent header on a custom template for a custom taxonomy, like this one: http://twinmotion.abvent.com/?sfid=5867&_sft_nation=south-africa&lang=enbut I don’t know how to assign the transparent header classes to the get_header() function just for this kind of pages.
Thanks for your helpRiccardo
April 3, 2015 at 9:18 pm #423272Hi!
Hmm, you cannot select the transparent header when editing the custom post type? If you do not see the header options when editing your custom post type then you can add them by doing this, https://kriesi.at/support/topic/put-enfold-post-layout-options-into-learndash-post/#post-394709.
Regards,
ElliottApril 17, 2015 at 5:09 pm #430433Hi! sorry for the delay.
I know how to enable the transparent header options for single forum page (as you can see here: http://twinmotion.abvent.com/forums/forum/libraries)
but I am not able to enable it for the forums archive page: http://twinmotion.abvent.com/forums/At this moment, I created a forum.php template page.
Thanks!
Riccardo
April 20, 2015 at 4:21 pm #431387Hey!
You would have to use some custom CSS for the archives. You can use this to get started.
.forum-archive .header_bg { background:transparent !important; } .forum-archive #main { padding-top: 0px !important; }
Best regards,
ElliottNovember 1, 2017 at 5:46 pm #871320Hi there,
I have similar question about this issue. Using The Events page templates, how can I add Transparent Header and nice background image to these Archive pages?
1) http://intelsys.build/events/
2) http://intelsys.build/events/list/?tribe_paged=1&tribe_event_display=pastI created custom template with Advanced Editor, but unfortunately the list layout is totally different from Events layout, but I would like to have the same Transparent Header and Background like here: http://intelsys.build/upcoming-events/
Is it possible to achieve?
Thanks!
November 4, 2017 at 5:17 am #872390Hi,
Thank you for using Enfold.
This is possible but you have to modify the template files of the plugin manually. If you want to set the header of the events archive pages to transparent, use the following filter in the functions.php file.
add_filter('avf_header_setting_filter', 'avf_header_setting_filter_mod', 9999, 1); function avf_header_setting_filter_mod($header) { if( is_post_type_archive( 'tribe_events' ) ) { $header['header_transparency'] = 'header_transparency'; } return $header; }
Best regards,
IsmaelNovember 6, 2017 at 12:06 pm #872985Thank you Ismael.
This code actually messes up entire site. It doesn’t affect only Events page. Could you try to be more specific please?
But how do I add an image background to that layout? Do I use a shortcode, or do I have to hard code some code into Events page template?
Thank you!
- This reply was modified 7 years, 1 month ago by masuurikas.
November 6, 2017 at 5:42 pm #873214I would love to be able to add this kind of TRANSPARENT HEADER with background image like here: http://intelsys.build/upcoming-events/. But I would like to have it on Events Archive page here: http://intelsys.build/events/. Is it possible somehow?
Or maybe I could have the same LIST VIEW in grey table (http://intelsys.build/events/) also on this custom page, like here: http://intelsys.build/upcoming-events/
Looking forward to your feedback.
November 7, 2017 at 5:10 am #873536Hi,
This code actually messes up entire site. It doesn’t affect only Events page. Could you try to be more specific please?
My bad. The code was invalid. We modified it a bit. Please try it again
But how do I add an image background to that layout? Do I use a shortcode, or do I have to hard code some code into Events page template?
Yes, you can use existing theme shortcodes or you can create your own html layout.
Best regards,
IsmaelNovember 7, 2017 at 12:23 pm #873626Hi there,
I kind of tried editing plugins LIST template. But I ended up like this without any transparent background: http://intelsys.build/events/
Also the image background isn’t 100%. Looks nothing like other content pages, for example: http://intelsys.build/about/
Is that even correct approach to add this HTML script (private content) to Tribe Event plugins PHP file? /src/views/list.php
November 7, 2017 at 1:22 pm #873653Ismael, could you please review my previous reply and help me with the layout so it would look the same as other content pages FULLWITH background image and TRANSPARENT HEADER.
I added the filter to functions.php file also, but don’t see any transparent header.
Looking forward to your reply.
November 8, 2017 at 4:01 am #873965Hi!
Yes, that a valid code but you have to put the color section outside the “container” to make it full width. You can use the “ava_after_main_container” hook instead of editing the template file.
add_action( 'ava_after_main_container', 'ava_after_main_container_mod' ); function ava_after_main_container_mod() { if( is_post_type_archive( 'tribe_events' ) ) { // color section html or shortcode here } }
Regards,
IsmaelNovember 8, 2017 at 4:52 am #873983Interesting. I end up getting syntax error when I add this SHORTCODE there.
[av_section min_height='50' min_height_px='500px' padding='large' shadow='no-border-styling' bottom_border='no-border-styling' bottom_border_diagonal_color='#333333' bottom_border_diagonal_direction='' bottom_border_style='' id='' color='main_color' custom_bg='' src='https://intelsys.build/wp-content/uploads/2017/07/download-intelsys-build-whitepaper.jpeg' attachment='448' attachment_size='full' attach='scroll' position='center center' repeat='stretch' video='' video_ratio='16:9' overlay_enable='aviaTBoverlay_enable' overlay_opacity='0.5' overlay_color='#000000' overlay_pattern='' overlay_custom_pattern='' av_element_hidden_in_editor='0' custom_class='']
<span style=”color: #ffffff;”>We are looking forward to meeting you at our events and industry conferences.</span>
[/av_heading]
[/av_section]November 8, 2017 at 5:05 am #873988Or which shortcode should I put there? Maybe I’m doing it wrong? And should I keep the previous filter in the function.php file or only the new one with the shortcode?
November 8, 2017 at 6:47 am #874047Hi,
Yes, you should keep the previous filter. You have to use the do_shortcode function.
// https://developer.wordpress.org/reference/functions/do_shortcode/
Example:
add_action( 'ava_after_main_container', 'ava_after_main_container_mod' ); function ava_after_main_container_mod() { if( is_post_type_archive( 'tribe_events' ) ) { echo do_shortcode("[av_section min_height='50' min_height_px='500px' padding='large' shadow='no-border-styling' bottom_border='no-border-styling' bottom_border_diagonal_color='#333333' bottom_border_diagonal_direction='' bottom_border_style='' id='' color='main_color' custom_bg='' src='http://intelsys.build/wp-content/uploads/2017/07/download-intelsys-build-whitepaper.jpeg' attachment='448' attachment_size='full' attach='scroll' position='center center' repeat='stretch' video='' video_ratio='16:9' overlay_enable='aviaTBoverlay_enable' overlay_opacity='0.5' overlay_color='#000000' overlay_pattern='' overlay_custom_pattern='' av_element_hidden_in_editor='0' custom_class=''] <span style=”color: #ffffff;”>We are looking forward to meeting you at our events and industry conferences.</span> [/av_heading] [/av_section]"); } }
If there is layout issue after using the shortcode, try to use the actual html instead.
Best regards,
IsmaelNovember 8, 2017 at 11:56 am #874114Thank you Ismael. I’m trying to add this do_shorcode function to “function.php” file, but I still get syntax error. Is there anything I’m doing wrong?
[av_section min_height='50' min_height_px='500px' padding='large' shadow='no-border-styling' bottom_border='no-border-styling' bottom_border_diagonal_color='#333333' bottom_border_diagonal_direction='' bottom_border_style='' id='' color='main_color' custom_bg='' src='https://intelsys.build/wp-content/uploads/2017/07/download-intelsys-build-whitepaper.jpeg' attachment='448' attachment_size='full' attach='scroll' position='center center' repeat='stretch' video='' video_ratio='16:9' overlay_enable='aviaTBoverlay_enable' overlay_opacity='0.5' overlay_color='#000000' overlay_pattern='' overlay_custom_pattern='' av_element_hidden_in_editor='0' custom_class='']
[av_heading heading='<span style="font-weight: 900;">EVENTS</span>' tag='h1' style='blockquote modern-quote modern-centered' size='79' subheading_active='subheading_below' subheading_size='17' padding='10' color='custom-color-heading' custom_font='#fcca0a' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' custom_class='' admin_preview_bg='']
<span style=”color: #ffffff;”>We are looking forward to meeting you at our events and industry conferences.</span>
[/av_heading]
[/av_section]November 8, 2017 at 7:20 pm #874288Can you please reply to my previous message. This shortcode example gives me full background without any transparent heading. Also, when I try my own shortcode that I pasted in my last message, it gives me syntax error. I cannot figure out this seemingly simple thing. Could you please help me with that layout?
What I would like for Events Archive page is the same TRANSPARENT header and background image as here: http://intelsys.build/upcoming-events/. Could you please advise?
Thank you and looking forward to your reply.
- This reply was modified 7 years, 1 month ago by masuurikas.
November 9, 2017 at 4:58 am #874382Hey!
If the shortcode is not working, please use the actual html code of the color section. Or provide the WP and FTP details in the private field so that we can test the modifications.
Cheers!
IsmaelNovember 9, 2017 at 12:37 pm #874619Hi, also adding HTML of a color section gives syntax error. Please take a look to LOGIN and FTP credentials. I really appreciate your help. Would be really happy to make this EVENTS page finally looking good with the color section background 50% and TRANSPARENT header.
Thank you and looking forward to your feedback.
- This reply was modified 7 years, 1 month ago by masuurikas.
November 9, 2017 at 11:23 pm #874878Hello. Did you have a chance to check about this issue? I’m looking forward to your feedback to finally resolve it.
Thank you!
November 10, 2017 at 6:47 am #875028Hi,
I tried to access the login page but it doesn’t exist. I also tried “wp-admin” and “wp-login” but it’s still not working.
Best regards,
IsmaelNovember 10, 2017 at 11:42 am #875107Right, I updated the correct login page. Please try again.
November 13, 2017 at 4:55 am #875933Hi,
We modified the code in the functions.php file.
add_action( 'ava_after_main_container', 'ava_after_main_container_mod' ); function ava_after_main_container_mod() { if( is_post_type_archive( 'tribe_events' ) ) { echo '<div id="av_section_1" class="avia-section avia-section-events main_color avia-section-large avia-no-border-styling avia-full-stretch av-section-color-overlay-active avia-bg-style-scroll avia-builder-el-0 el_before_av_upcoming_events avia-builder-el-first av-minimum-height av-minimum-height-50 container_wrap fullsize" style="background-repeat: no-repeat; background-image: url(https://intelsys.build/wp-content/uploads/2017/07/download-intelsys-build-whitepaper.jpeg); background-attachment: scroll; background-position: center center; " data-section-bg-repeat="stretch"><div class="av-section-color-overlay-wrap"><div class="av-section-color-overlay" style="opacity: 0.5; background-color: #000000; “></div><div class="container"><main role="main" itemprop="mainContentOfPage" class="template-page content av-content-full alpha units"><div class="post-entry post-entry-type-page post-entry-431"><div class="entry-content-wrapper clearfix"> <div style="padding-bottom:10px;color:#fcca0a;font-size:79px;" class="av-special-heading av-special-heading-h1 custom-color-heading blockquote modern-quote modern-centered avia-builder-el-1 avia-builder-el-no-sibling av-inherit-size “><h1 class="av-special-heading-tag " itemprop="headline"><span style="font-weight:900">UPCOMING EVENTS</span></h1><div class="av-subheading av-subheading_below av_custom_color " style="font-size:17px;"><p><span style="color:#ffffff">We are looking forward to meeting you at our events and industry conferences.</span></p> </div><div class="special-heading-border"><div class="special-heading-inner-border" style="border-color:#fcca0a"></div></div></div> </div></div></main><!– close content main element –></div></div></div>'; } } add_filter('avf_header_setting_filter', 'avf_header_setting_filter_mod', 9999, 1); function avf_header_setting_filter_mod($header) { if( is_post_type_archive( 'tribe_events' ) ) { $header['header_transparency'] = 'header_transparency'; $header['header_class'] .= ' av_header_transparency'; } return $header; }
And then added the css code in the Quick CSS field.
.avia-section-events { min-height: 50vh; }
Please remove browser cache or hard refresh before checking the page.
Best regards,
IsmaelNovember 13, 2017 at 11:02 am #876023Thank you. But current view is quite strange. The background isn’t 50% of screen. Also the headline “UPCOMING EVENTS” is transparent. The solution doesn’t look like other page such as http://intelsys.build/about/. How can I improve that?
Current view is kind of half way http://intelsys.build/strange-view.png
- This reply was modified 7 years, 1 month ago by masuurikas.
-
AuthorPosts
- The topic ‘Assign the Transparent header to a custom category archive’ is closed to new replies.