Forum Replies Created
-
Posts
-
Hey!
Are you using any custom CSS? i strongly suspect that the custom modification is causing this issue…
The below css will fix the top header but the main header has default inline style which will make it scroll -30px top so you cannot make any changes to it using external css.
We would like to take a closer look please create a temporary user with ‘administrator’ role and share in private content with permission to deactivate all plugins and add custom code if necessary to help you resolve this issue.
#header_meta { position: fixed!important; top: 0!important; width: 100%!important; }Regards,
Vinay KashyapHi Dave!
The description you have provided is not clear but let me try to answer
To have a border around the mobile menu icon please use this css
@media only screen and (max-width: 767px) { #top #wrap_all .av_header_transparency, .av_header_transparency #advanced_menu_toggle { border-color: #f15b29!important; } }To remove the underline in desktop menu Enfold option > header > header layout > Header Style > minimal
If this is not what you are looking for please produce a mockup and upload to dropbox and share the link with us so we can help you better :)
Cheers!
Vinay KashyapHey!
To disable the border for the active menu please use this css in Enfold > General styling > Quick CSS
.current-menu-item a { border-bottom:none!important; }Cheers!
Vinay KashyapHey!
Sorry i am not aware of the 3rd party plugin you are using it would be best to ask the plugin author about it.
To add different background image to different pages right click inspect the page and view the <body class”so many class names”>
Woocommerce has different class names for product page, shop, cart and checkout pages
for example if you inspect the product page woocommerce adds class “single-product” to the product pages.
You can then use these class names and add your custom backround image in quick css like
.single-product{ background-image: url("image.jpg"); background-size:cover; }Cheers!
Vinay KashyapHey!
You need to add some code in the <head> section of your wordpress site
Please use a plugin like https://wordpress.org/plugins/header-footer/installation/Adjust the 100px as required in the below code and add it in the plugin options int he head section.
<!--[if lt IE 9]>[ #rev_slider_1_1_wrapper { margin-top:100px; } ]<![endif]-->Regards,
Vinay KashyapHey!
We are working on your ticket please wait while we update the results here soon.We checked in all the latest browsers but could not find the outline let us know which browser you see this issue in if the below code do not work for you.
use this in quick css
video { outline:none!important; border: 0!important; }Cheers!
Vinay KashyapHey!
Sorry for the delay. We do appreciate your patience :) Some of our moderators have health issues and at the moment we are a little busy but we try to answer everyone as soon as possible.
Answering many questions in one ticket get’s confusing as the questions and answers tend to get mixed up in one ticket . let’s keep the focus on one topic in one ticket. Please create new tickets for different issues.
Alright! let’s get to the issues and help you resolve them…
1. when clicking the menu toggle the page will jump back to top.
Remove the “href=”#” ” from the menu
<a id="advanced_menu_toggle" href="#" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></a>2. when fly out menu is active, the menu toggle icon and the close button are not alligned….
You need to use the option Enfold > Header > header behavior > Let logo and menu position adapt to browser window
By doing so the mobile menu will be placed to the right side of the header.
3. 4. 5.
Please create a new tickets for each issue.
6. The advanced menu toggle is currently not visible on tablet.
To make the header sticky in tablet use the below css in Quick CSS
@media only screen and (max-width: 767px) { #header_main { position: fixed!important; } }Cheers!
Vinay KashyapHi flippingrocks!
We are working on your ticket please wait while we update the results here soon.You have pointed out the issue but haven’t mentioned exactly what you want to do with it… I’m assuming you want to disable the image overlay.To disable the image over please add the css provided int he below link to Enfold > General Styling > Quick CSS
Cheers!
Vinay KashyapHey!
We are working on your ticket please wait while we update the results here soon.Please enable custom class http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
add a custom-class name to the element or text widget which has the text that is touching the edge.Add the below css in Enfold > General styling > Quick CSS
/*break words*/ @media only screen and (max-width: 767px) { .custom-class h2 { word-break: break-all!important; } }Another solution is to use a </br> tag before the words that touch the edge. this will break the line and there will be enough space and it is more readable.
Regards,
Vinay KashyapHey envapk2!
We are working on your ticket please wait while we update the results here soon.Please add the below code to your child theme or in Quick CSS
.sub-menu{ z-index:9999!important; }Regards,
Vinay KashyapHey!
We are working on your ticket please wait while we update the results here soon.Please goto Appearance > menu and select button style from the dropdown as seen in the below screenshot
Add the below css in Enfold > General styling > Quick CSS
/* menu button style*/ .av-menu-button { color:#FFF!important; background: #eb7d3c!important; }Best regards,
Vinay KashyapHey!
We checked the page in question and everything seem to work fine however if you still have the issue
Here is a better version of the code to highlight the full width sub menu items and you don’t need to add different menu id’s either. make sure you remove the previous code and add the below code and link to different section it should work out of the box. (This is designed to work for color sections)
In situations where you cannot use color sections enable custom class support and add class “avia-section” to the ALB element even if it is a 1/1 section the script will work just fine :)
kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
function activateMenuItem(){ ?> <script> jQuery(document).scroll(function() { var sections = jQuery('.avia-section'), menu = jQuery('.av-submenu-container'), nav_height = menu.outerHeight(); jQuery(window).on('scroll', function() { var cur_pos = jQuery(this).scrollTop(); sections.each(function() { var top = jQuery(this).offset().top - 300, bottom = top + jQuery(this).outerHeight(); if (cur_pos >= top && cur_pos <= bottom) { menu.find('a').removeClass('active-menu-item'); menu.find('a[href="#' + jQuery(this).attr('id') + '"]').addClass('active-menu-item'); } }); }); }); </script> <?php } add_action('wp_head', 'activateMenuItem');Regards,
Vinay KashyapHi!
I’m not sure what you mean by cut the text? but as you might already know to reduce the excerpt length you just need to change the “XX” number in the below line of the final code provided.
return currentText.substr(0, XX);Best regards,
Vinay KashyapHey!
We are working on your ticket please wait while we update the results here soon.The final code we added in quick css is
/* Logo position*/ @media only screen and (max-width: 767px) { .responsive .logo img { max-height: 80px!important; } .header_bg { min-height: 120px!important; } .av-logo-container { top: -23px!important; width:100%!important; } .html_header_top.html_logo_center .logo { left: 0%!important; transform: none!important; } .responsive #top .logo { margin-left: 0px!important; } }please check the site now…
Cheers!
Vinay KashyapHey!
That’s great!
As I understand you require one script to work in both situation
Situation -1 : If the excerpt length is less than the available space you need the “…”
Situation -2 : If the excerpt length is more than the available space the “…” should be removedThis requires a complex algorithm and a lot of time to accomplish it you might have to hire a freelancer
We are more than happy to help you with any minor changes modifications you need. Please let us know if you need any other minor changes we are happy to help :)
Cheers!
Vinay KashyapHey!
This is the final code we added and it is working correctly now
/* Validation error font color*/ .form_element.error input { background-color: #df6f1f !important; } .form_element.error input::-webkit-input-placeholder { color:#FFF!important; } .form_element.error input:::-moz-placeholder { color:#FFF!important; } .form_element.error input::-ms-input-placeholder { color:#FFF!important; } .form_element.error input::placeholder { color:#FFF!important; }Regards,
Vinay KashyapHey!
It’s a production site so i would prefer having FTP access and try the new code.
Please replace all the code both excerpt length and title with the below code
// Excerpt length function custom_excerpt(){ ?> <script> jQuery(window).load(function(){ jQuery('.type-portfolio').each(function() { jQuery(".entry-content").text(function(index, currentText) { return currentText.substr(0, 100); }); jQuery(".entry-title").text(function(index, currentText) { return currentText.substr(0, 50); }); }); jQuery(".type-portfolio").find(".entry-content").append("…"); jQuery(".type-portfolio").find(".entry-title").append("…"); }); </script> <?php } add_action('wp_footer', 'custom_excerpt');If this don’t work correctly please setup FTP access for us.
Cheers!
Vinay KashyapHi!
Login as admin and goto blog page on top you find a black bar with wordpress options click “Edit page” it takes you to the blog page
or Admin > pages > blogand when you are in the blog page click on blog post element to see more options.
hope this helps :)
Regards,
Vinay KashyapHi!
We are happy to help! please create a temporary user with ‘administrator’ role and share in private content with permission to deactivate all plugins and add custom code if necessary to help you resolve this issue.
Regards,
Vinay KashyapHey!
The easiest way to import demos without losing your current published pages is to have 2 wordpress installations.
One will be your productions site and the other will be your dev site.
On your development site and production site enable debug mode and custom class name support
kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/
http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/Once debug mode is enabled you can copy page shortcodes of the Advance layout builder elements and paste it to the production site to get an exact duplicate of the page without having to import the whole demo to your production site.
So to come to your issue let us know if you have access to mysensei.dk and dlcs.dk ? You can simply enable debug mode and copy the short code from the pages.
Cheers!
Vinay KashyapHi aovivo!
This is out of our support scope but we are more than happy to point you to some helpful resources so you can achieve what you are looking for..
Please check these links
https://docs.woothemes.com/document/template-structure/
Cheers!
Vinay KashyapHey!
We are working on your ticket please wait while we update the results here soon.I checked all the threads in this ticket but there is no accurate info about the exact issue you are facing. However you mentioned it works correctly in IE10 so I compared the slider in IE10 to Edge and Chrome
Screenshot 1 : The Team members slider looked exactly same in all 3 browsers
There is a bit of image compression please pre compress the png images using https://tinypng.com/ and re-upload it.
Screenshot 2 : The only difference i noticed was that the 3D cube animation is not showing in IE
Please check the attached screenshots and let us know exactly what is the issue you are having with the slider? If possible please share some screenshots of the issue..
Cheers!
Vinay KashyapHey!
Sorry for the delay.
We are working on your ticket please wait while we update the results here soon.The image in the private content is applied as a inline style using color section. inline styles have the highest specificity and cannot be altered using custom CSS. The result you get using color section is final.
If you like to make alterations or modify the image in mobile screens you need to remove the background image from color section and apply it using custom CSS.
Add an ID to the color section and use the below css to remove background image in portable devices
#bgimage{ background: #000 url(https://nrtt.com/wp-content/uploads/2016/02/nrtt-our-services-background-75.jpg); background-size: 80%; background-position:bottom right; } /* Home page section images on mobile */ @media only screen and (max-width: 767px) { #bgimage{ background: #000!important; } }To maintain the ratio of the image use background size property.
This link has some detailed explanation
https://css-tricks.com/almanac/properties/b/background-size/ ( check out related article links)
https://css-tricks.com/almanac/properties/b/background-image/Hope this helps :)
Cheers!
Vinay KashyapHey!
Nope it’s still not working :( this is the message i get
“This site has been temporarily disabled, please try again later.”
Please get in touch with us when we can access the site so we can help you resolve this issue.
Did you contact your hosting company about the Virus Alert ?
Cheers!
Vinay KashyapHey!
Sorry for the delay.
We tried to login to your site from the URL mentioned in the private but it did not work please share the URL where we can inspect the elements in question and kindly request you to open new tickets for new issues so we can keep the focus on one issue in each ticket if they are not related and help resolve it faster.
Best regards,
Vinay KashyapHey!
We are working on your ticket please wait while we update the results here soon.1. The color section background image is applied as an inline style hence it’s specificity is the highest and no external CSS will make any change to it.
2.There is a syntax error after the #hometopimage an extra “.” exist
Please make these changes to achieve what you are trying to do.
1. Remove the background image from color section and the custom CSS.
2. Add and remove background image via external CSS
#hometopimage{ background: #000 url(https://edwardsvilleinjurylawyer.com/wp-content/uploads/2015/10/bkgd-servicerep.jpg); background-size: cover; } /* Home page section images on mobile */ @media only screen and (max-width: 767px) { #hometopimage{ background: #000!important; } }If you still have any issue please deactivate your child theme and activate the main enfold theme and re-check to confirm everything is alright with the child theme.
Cheers!
Vinay KashyapHi ccyran!
The captions show empty when I inspect the element and check in the chrome browser. This could be because of a conflict with a plugin.
To find the plugin in conflict please follow the below steps
1. Goto plugins page > Deactivate all active Plugins
2. Updated WordPress and Enfold to latest version if you have not.
3. Activate one plugin at a time… refresh the page and check for the issue.
4. Make sure the plugins are all updatedIf you still have any issues we would like to take a closer look at the setup in the backend please create a temporary user with ‘administrator’ role and share in private content with permission to deactivate all plugins and add custom code if necessary to help you resolve this issue.
For the second issue we will provide you custom css to make the description of the image bold. Let’s resolve the first issue so we can see the description of the image.
Regards,
Vinay KashyapHi!
We are working on your ticket please wait while we update the results here soon.We are going to need some more time to look into this deeply at the moment if you require autoresponder emails to work while using the contact form element we recommend using one email only until we let you know further.
There are 3rd party plugins which offer this feature however we haven’t tried this with multiple emails but if you like to give it a try
Contact Form 7
Contact Form 7 autoresponder setup guide
Plugin extension for CF7Regards,
Vinay KashyapHey!
We are working on your ticket please wait while we update the results here soon.To make the menu look like this…
Please add the below css in Quick CSS you can remove dividers from enfold > header > Separator between menu items
/* Equal Spaced Menu */ .html_header_top.html_logo_center .main_menu ul:first-child { display: flex; justify-content: space-between; }If it’s not something you wanted to do please share a mockup of what you want it to look like.
Cheers!
Vinay Kashyap
