Topic can be closed.

The same procedure like many times before. Working on an issue without succes for minutes or houres. Then writing a ticket and the problem is solved easyly after it by myself. So Sorry.

I added Quick CSS:

body, body p, body a {
font-size: 22px!important;
font-weight: 100 !important;
}

Seems I had an error in my quick CSS before.

Best bregards

Marcus

Hi Nikko!

Fixed it now so you can log in :)

BTW today the text in the blog post on https://oldozjavidi.com/ is correct size. Strange? Yesterday it showed a font size equal to the font size of the “quotes” text element below it.

Can you see if the bottom color section can be fixed to make it go all the way out to the edges of the screen?

Thanks!

Hi Victoria,

I will break it down for you.

I want to create a full-width sticky button above the header.

I did the following to implement it
**In Header Widget I have added**

[av_button_big label='DONATE' description_pos='below' icon_select='yes-left-icon' icon='ue806' font='entypo-fontello' link='manually,https://www.humanitycarerelief.org.uk/donations/support-humanity-care-relief-projects/' link_target='' size='large' position='center' icon_select='yes' icon_hover='aviaTBicon_hover' icon='ue82b' font='entypo-fontello' color='custom' custom_bg='#db332a' custom_font='#ffffff' admin_preview_bg=''][/av_button_big]

**In Function.php I am adding**

add_action( ‘ava_main_header’, ‘enfold_customization_header_widget_area’ );
function enfold_customization_header_widget_area() {
dynamic_sidebar( ‘header’ );
}

**In Quick CSS I have added**

@media only screen and (min-width: 990px) {
#header .widget { display: none !important; }
}

custom_html-2 .custom-html-widget {padding: 0 50px; width: 767px;
margin: auto;}
#custom_html-2.widget {background-color: #ffcd03;}
#custom_html-3 .avia-button.avia-size-large {
font-size: 20px!important;
}
@media only screen and (max-width: 767px) {
#custom_html-2 .custom-html-widget {
width: auto;
}
}
#header .widget {
left: 0;
top: -5px;
transform: translate(0%);
width: 100%;
padding: 0;
}

Once I done that … then the layout of my website broke down.

See screen shot #1
https://www.humanitycarerelief.org.uk/wp-content/uploads/2021/01/Mobile-1.jpg
What’s wrong with this screen shot
1. look at the height of the button
2. where is the burger menu
3. it is showing social icons when it shouldnt show
4. Save Live in Yemen (it is showing two banners whilst top one is for Desktop and the bottom one for mobile

See screen shot #2
https://www.humanitycarerelief.org.uk/wp-content/uploads/2021/01/Mobile-2.jpg

Mobile view is showing 3 column when it should show each image in single column

See screen shot #3
https://www.humanitycarerelief.org.uk/wp-content/uploads/2021/01/Mobile-3.jpg

Same issue as above

See screen shot #4
https://www.humanitycarerelief.org.uk/wp-content/uploads/2021/01/Mobile-4.jpg

Same issue as above the whole mobile layout is broken.

I had to disable all the codes on the website as I wasn’t getting any response from the support team. Because I cannot leave the website in this state.

There is something wrong with the HTML code but I am struggling to figure out what.

Because as soon as I enable that this happens.

So far everytime I had a problem your support team has helped me but this time it’s been slow.

If you see this ticket and the other ticket I have provided login details at both of them so if you want you can login and enable those codes and see it yourself.

Looking forward to hearing from you.

PS. if you can give me exact UK time when you are online to see this then I can enable the code so you can see the live website being affect by this.

Kind regards,

http://www.projectt.co.uk

Hi Nikko,

Thank you, I got the icons working and the color change on the font but the size is still not changing…. Could you please help.

Thanks again,
Lindsay

Hi Rikard

Thank you for getting back to me.

That code fixes most of the issues but still the title is white and large font even though the code should make it black and small font.
I changed the font size to 8 (just to see if it was taking effect)

Here’s what I used:

.page-id-1064 .avia-content-slider h3.slide-entry-title {
font-size: 8px;
color: #000;
}

.page-id-1064 .avia-content-slider .slide-entry-excerpt {
color: red;
}

.page-id-1064 .avia-content-slider .slide-meta .slide-meta-comments, .page-id-1064 .avia-content-slider .slide-meta .slide-meta-del {
display: none;
}

Thanks, Rikard
unfortunately, that did not work.
Here are my menu related entries

/* –AS– Making font “normal” for the main menu */
#top .av-main-nav > li > a {
font-weight: normal !important;
}
—> Works just fine

/* — AS — SHOWS ACTIVE PAGE IN MENU — */
.av-main-nav>li.current-menu-item>a>.avia-menu-text,.av-main-nav>li.current-page-ancestor>a>.avia-menu-text {
color: #049bd6 !important;
}
— works perfectly

/* –AS– Making sub-menu font 15px */
#top .av-subnav-menu li a {
font-size: 13px;
}
—> did work but no longer

/* –AS– Making active sub menu blue */
ul.sub-menu .current-menu-item .avia-menu-text span {
color: #049bd6 !important;
}
—> Trying font-weight, then testing with color — not working

/* –AS– stretching the pulldown menu to 240 px */
.main_menu .menu ul { width: 240px; }.
—> works well

Maybe a conflict with the other entries?
The above is in the order as listed.
Thanks
Axel

This is what I am trying but the button is showing on the logo .. Rikard’s solution doesn’t work as it adds extra space above the header and makes the button completely out of line.

**In Header Widget I have added**

[av_button_big label='DONATE' description_pos='below' icon_select='yes-left-icon' icon='ue806' font='entypo-fontello' link='manually,https://www.humanitycarerelief.org.uk/donations/support-humanity-care-relief-projects/' link_target='' size='large' position='center' icon_select='yes' icon_hover='aviaTBicon_hover' icon='ue82b' font='entypo-fontello' color='custom' custom_bg='#db332a' custom_font='#ffffff' admin_preview_bg=''][/av_button_big]

**In Function.php I am adding**

add_action( ‘ava_main_header’, ‘enfold_customization_header_widget_area’ );
function enfold_customization_header_widget_area() {
dynamic_sidebar( ‘header’ );
}

**In Quick CSS I have added**

@media only screen and (min-width: 990px) {
#header .widget { display: none !important; }
}

custom_html-2 .custom-html-widget {padding: 0 50px; width: 767px;
margin: auto;}
#custom_html-2.widget {background-color: #ffcd03;}
#custom_html-3 .avia-button.avia-size-large {
font-size: 20px!important;
}
@media only screen and (max-width: 767px) {
#custom_html-2 .custom-html-widget {
width: auto;
}
}
#header .widget {
left: 0;
top: -5px;
transform: translate(0%);
width: 100%;
padding: 0;
}

What I want to achieve.

I want to have a Full-Length Sticky Button above Header on Mobile ONLY. I don’t want the header (logo and burger menu to be sticky)

Right now my button is of full length but the layout of the whole website is broken. It is also showing the button on desktop but it shouldn’t as my CSS is telling it to hide the button on the desktop.

Please your help is urgently needed.

Kind regards,

• This reply was modified 5 years, 2 months ago by projectt_co_uk.

Thanks Ismael,

I can see the changes you have made in the logo section. Do you know why the logo is still/always slightly out of focus even when at full size (current) – at least on my macbook?

If I try to change the footer size by amending the px size to smaller again, nothing changes – eg 8px?:
.widgettitle {
font-size: .8em;
}

#footer .widget p {
font-size: 8px;
}

The other quick css you had originally suggested for the space before testimonial or adding space below the main menu didn’t work:
1.c) This css code should remove the 100px left margin of the testimonial name.
.avia-testimonial-meta {
margin-left: 0;
}

1.b) Use this css code to add a space below the main menu and above the main content.
#header_main_alternate {
padding-bottom: 50px;
}

Hope this makes sense,
Kristin

Hey Ismael

This is indeed a plugin of https://totalery.com/
They have already taken care of this matter, thank you very much

I need something else in the same matter
For these two pages
1.

2.
http://213.8.209.12/~israelmediators/listings/%d7%a0%d7%95%d7%a8%d7%99%d7%aa-%d7%a7%d7%95%d7%91%d7%a8 % d7% 98% d7% 95% d7% 91% d7% a1% d7% a7% d7% 99 /

They do not look good on a mobile
They also belong to the plugin, the problem is that there is padding that I can not undo (I am not that talented at working with code) Anyway I did a lot of attempts and searches here with your support and in the end I came to this code which is not a good solution

If there are parts here that are not needed I would be happy to help here

@media only screen and (max-width: 1499px) {
#top.single .entry-content {
max-width: 100% !important;
margin:0 auto;
}
#top.single .entry-content-wrapper {
max-width: 100% !important;
margin:0 auto;
padding:0 5px;
}
}
—-
#top.single .entry-content {
max-width: 100% !important;
margin:0 auto;
}
#top.single .entry-content-wrapper {
max-width: 100% !important;
margin:0 auto;
padding:0 5px;
}
#top.single .entry-content {
max-width: 70% !important;
margin:0 auto;
}
#top.single .content {
padding-top: 10px !important;
}
span.image-overlay.overlay-type-image{
display:none!important;
}
.av-sort-by-term span{
font-size:18px!important;
}

Best regards,
Yossi