Hi,

Thank you for the update.

You can use this css code to adjust the vertical position of the phone number.

#header_main .phone_number a {
    top: -10px;
    position: relative;
}

Also I edited the size but it is not reflecting. Did I do something wrong?

Did you adjust the font-size value in this css rule?

#header_main .phone_number a p {
    font-size: 64px;
}

Best regards,
Ismael

Hey diefleischerei,
Thanks for your question you can create a print button with this code in the page:
<button class="print" onclick="window.print()">Print This</button>
and this css:

button.print {
    background-color: #0366d6;
    color: #ffffff;
    border-radius: 3px 3px 3px 3px;
    border: none;
    border-width: 1px 1px 1px 1px;
}

This would be the results:

You will probably also want to use the print media query to set which elements print and which ones to avoid, for example:

@media print { 
	p {
	font-size: 18px;
	line-height: 1.1em;
	}
        .sidebar {
	display:none;
	}
	.single-post #content {
	text-align: center;
	top: unset;
	left: unset;
	transform: none;
	position: relative;
	background: none;
	width: 100%;
	padding: 0;
    }
}

Best regards,
Mike

Hey A,
Thanks for your patience and the link to your site, to make your header transparent only on your homepage and make the menu items white when the header is transparent so you can see them I added this css:

.html_header_top.html_header_sticky #header.av_header_transparency {
    background: transparent;
}
#top #header.av_header_transparency .av-main-nav > li > a {
    background-color: transparent;
}
#top #header.av_header_transparency .av-main-nav > li > a .avia-menu-text {
    color: #fff
}
#top #header.av_header_transparency .av-main-nav > li#menu-item-search > a {
	color: #fff;
}
#top #header.av_header_transparency .av-main-nav li:hover .avia-menu-fx, 
#top #header.av_header_transparency .current-menu-item > a > .avia-menu-fx, 
#top #header.av_header_transparency .av-main-nav li:hover .current_page_item > a > .avia-menu-fx {
    background-color: #fff;
}

To remove the social icons I removed them at Enfold Theme Options ▸ Social Profiles, none of them had links so they would not do anything on click anyways.
Then I added this css to make your phone number larger and move the menu over to make room:

#header_main .phone_number a p {
	font-size: 47px;
}
#header_main .avia-menu.av_menu_icon_beside {
    margin-right: 336px;
}

If you want the phone number smaller feel free to adjust
please clear your browser cache and check.

Best regards,
Mike

Hi Tilman,

Please add following code to Quick CSS field in Enfold theme options > General Styling tab

/* No capitals */
.avia-toc-style-elegant a {
  text-transform: none;
}
/* Font size for level 1 */
.avia-toc-style-elegant .avia-toc-level-1 {
  font-size: 20px;
}
/* Font size for level 2 */
.avia-toc-style-elegant .avia-toc-level-2 {
  font-size: 18px;
}
/* Style toggle button */
.toc-toggle {
  background: transparent;
  border: none;
  font-size: 20px;
}

Then add following code to bottom of functions.php file of your child theme to add toggle button to TOC

add_action('wp_head', 'toggle_toc');
function toggle_toc(){
 ?>
 <script>
 jQuery(window).load(function(){
	var $input = jQuery('<input class="toc-toggle" type="button" value="≡" />');
    $input.prependTo(jQuery(".avia_auto_toc"));
	 
	jQuery( ".toc-toggle" ).click(function() {
	jQuery( ".avia-toc-container" ).toggle();
});
	 
});
 </script>
<?php 
}

Best regards,
Yigit

Hi,

Thank you for the update.

Have you tried adjusting the font size values in the Customize Typography Settings ? You can adjust the default font size and specify different values for small, medium and very small screens. You may need to add custom css media queries for other screen sizes that are not covered by the typography settings.

Best regards,
Ismael

Hey Arobazinfo,

Thank you for the inquiry.

Which elements are you using? You can specify font sizes for different screen width in the Enfold > General Styling > Advanced Options: Customize Typography Settings section. You can also edit certain elements in the Enfold > Advanced Styling panel and use css media queries in the Enfold > General Styling > Quick CSS field to further adjust the style of certain elements. Please check the article below for more info about css media queries.

// https://css-tricks.com/a-complete-guide-to-css-media-queries/

Best regards,
Ismael

Hi,

You can upload screenshots to a service like Google Drive, Dropbox or similar, then link to it here.

I doubt that the update caused this though, since the styling is coming from your child theme:

.row_courses a {
    color: #003087;
    font-family: 'open_sansbold';
    font-size: 20px;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 75px;
}

.row_courses a {
    font-size: 17px;
    bottom: 35px;
}

The row_courses class is not a theme class either, so it’s something that has been added by someone else.

Best regards,
Rikard

Hey seo-systeme,

Thank you for the inquiry.

In the code below, we modified the parallax banner function a bit to include the category title and re-registers the template hooks. Please create a site backup, then add the code below in the functions.php file.

function avia_woocommerce_big_cat_banner_mod()
{
	if(is_product_category())
	{
		global $wp_query, $avia_config;

		if(isset($wp_query->query_vars['taxonomy']))
		{
			$term = get_term_by( 'slug', get_query_var($wp_query->query_vars['taxonomy']), $wp_query->query_vars['taxonomy']);
			if( ! empty( $term->term_id ) )
			{
				$description 	= term_description() ;
				$style		= avia_get_woocommerce_term_meta( $term->term_id, 'av_cat_styling' );
				$attachment_id 	= avia_get_woocommerce_term_meta( $term->term_id, 'thumbnail_id' );

				$overlay 	= avia_get_woocommerce_term_meta( $term->term_id, 'av-banner-overlay' );
				$font 		= avia_get_woocommerce_term_meta( $term->term_id, 'av-banner-font' );
				$opacity 	= avia_get_woocommerce_term_meta( $term->term_id, 'av-banner-overlay-opacity' );

				if(!empty($style))
				{
					remove_action( 'woocommerce_before_shop_loop', 'woocommerce_taxonomy_archive_description', 11 );
					echo avia_woocommerce_parallax_banner_mod($attachment_id, $overlay, $opacity, $description, $font);
					$avia_config['woo-banner'] = true;
				}
			}
		}
	}
}

function avia_woocommerce_shop_banner_mod()
{
	global $avia_config;

	if(is_shop() || (is_product_category() && avia_get_option('shop_banner_global') == 'shop_banner_global') && !isset($avia_config['woo-banner']))
	{
		$options = avia_get_option();

		if( isset( $options['shop_banner'] )  && ( $options['shop_banner'] == 'av-active-shop-banner' ) )
		{
			$bg 		= $options['shop_banner_image'];
			$overlay 	= $options['shop_banner_overlay_color'];
			$opacity 	= $options['shop_banner_overlay_opacity'];
			$description= wpautop( $options['shop_banner_message'] );
			$font 		= $options['shop_banner_message_color'];

			echo avia_woocommerce_parallax_banner_mod( $bg, $overlay, $opacity, $description, $font );
		}
	}
}

function avia_woocommerce_parallax_banner_mod( $bg, $overlay, $opacity, $description, $font )
{
	if( is_numeric( $bg ) )
	{
		$bg = wp_get_attachment_image_src($bg, 'extra_large');
		$bg = ( is_array( $bg ) && $bg[0] != '' ) ? $bg[0] : '';
	}

	if( $font )
	{
		$font = "style='color:{$font};'";
	}

	if( $bg )
	{
		$bg = "background-image: url({$bg});";
	}

	$output  = '';
	$output .= '<div id="av_product_description" class="avia-section main_color avia-section-large avia-no-border-styling avia-full-stretch av-parallax-section av-section-color-overlay-active avia-bg-style-parallax container_wrap fullsize" data-section-bg-repeat="stretch" ' . $font . '>';
	$output .=		'<div class="av-parallax avia-full-stretch" data-avia-parallax-ratio="0.3">';
	$output .=			'<div class="av-parallax-inner av-parallax-woo" style="' . $bg . ' main_color background-attachment: scroll; background-position: 50% 50%; background-repeat: no-repeat;">';
	$output .=			'</div>';
	$output .=		'</div>';

	$output .=		'<div class="av-section-color-overlay-wrap">';

	if( ! empty( $overlay ) )
	{
		$output .=		'<div class="av-section-color-overlay" style="opacity: '.$opacity.'; background-color: ' . $overlay . '; "></div>';
	}

	$output .=			'<div class="container">';
	$output .=				'<main class="template-page content av-content-full alpha units">';

	if( $description )
	{
		$title = get_the_archive_title();
		$output .=				"<h1>{$title}</h1>";
		$output .=				"<p>{$description}</p>";
	}

	$output .=				'</main>';
	$output .=			'</div>';
	$output .=		'</div>';
	$output .= '</div>';

	return $output;
}

add_action('after_setup_theme', function() {
    remove_action( 'ava_after_main_container', 'avia_woocommerce_shop_banner', 11 );
    remove_action( 'ava_after_main_container', 'avia_woocommerce_big_cat_banner', 11 );
    add_action( 'ava_after_main_container', 'avia_woocommerce_shop_banner_mod', 11 );
    add_action( 'ava_after_main_container', 'avia_woocommerce_big_cat_banner_mod', 11 );
}, 999);

Best regards,
Ismael

Hey gabrimore98,

Please try the following in Quick CSS under Enfold->General Styling:

.av-tab-section-container .avia-content-slider .slide-entry-title {
    font-size: 18px;
}

Best regards,
Rikard