-
Search Results
-
In reply to: Contact Form 7 with Enfold Styles
Thanks so much Victoria! thats a really clever bit of CSS!
I’ve set it at 1368px – just wider than iPad pro screen horizontal.
It works fine apart from a couple of small things:-1. On the wide desktop version where the name and email are side by side – the space between that line and the SUBJECT line below seems to be wider than when the 2 fields are stacked on top of each other.
2. Also on desktop perhaps the gap/padding above the Name/Email line is wider making a large gap between that line on desktop view and the bulleted text above. Ideally I would like the gaps above/below field to be consistent between desktop and mobile.
3. The CSS you provided to create black field borders is being carried into the Enfold Search field. Is there a way I can restrict this border styling to the CF7 form?
Here’s the full quick CSS i have for this contact page at the moment including your latest fixes.
/* CF7 Submit Button CSS Styles */
.wpcf7 input[type=submit] {
padding:15px 45px;
background:#FCE228;
color:#232323;
font-size:16px;
font-weight:bold;
border:1px solid #232323;
cursor:pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
}/* CF7 Submit Button CSS Hover Styles */
.wpcf7 input[type=submit]:hover {
background-color: #232323;
color: #FCE228;
border:1px solid #232323;
}/* CF7 Label Text Styles */
.wpcf7 label {
padding: 0 0 10px 0;
font-size: 20px;
color:#232323;
}/* CF7 File Upload Button CSS Styles */
.wpcf7 input[type=file] {
padding:0px 0px;
background:none;
color:#000;
font-size:14px;
border:none;
-webkit-border-radius: 3px;
border-radius: 3px;
}/* CF7 Input Field Heights */
.wpcf7 input[type=text] {height:40px;}
.wpcf7 input[type=email] {height:40px;}/* CF7 Input Field border and radius */
#top .main_color .input-text,
#top .main_color input[type=’text’],
#top .main_color input[type=’input’],
#top .main_color input[type=’password’],
#top .main_color input[type=’email’],
#top .main_color input[type=’number’],
#top .main_color input[type=’url’], #top .main_color input[type=’tel’],
#top .main_color input[type=’search’], #top .main_color textarea, #top .main_color select {
border-color: #232323;
border-radius: 3px;
margin-top: 5px;
}/* CF7 name and email Fields alongside but not on mobile */
@media only screen and (min-width: 1368px) {
#top .wpcf7-form-control-wrap.your-name input[type=text] {
width: 95%;}
.wpcf7-form div + p, .wpcf7-form div + p + p {
width: 50%;
float: left;}
.wpcf7-form div + p + p {
clear: right;
}}
————-
I also have some styling on the ENFOLD search button etc from some previous work as below:-/* ENFOLD Search Button and Hover CSS Styles */
#searchsubmit {
background-color:#fce228!important;
}
#searchsubmit {
color:#232323!important;
}
#searchsubmit:hover{
background-color:#232323!important;
}
#searchsubmit:hover {
color:#fce228!important;
}Thanks for your help :)
Pete
Hello everyone,
Again I have a situation and I could use some help!
Some data that might be helpful
–> WP version: 4.9.5 Enfold child theme (latest Enfold them purchased couple of days ago)When I install the plugin Request for a Quote form YITH (PRO paid version with license) the button that should be there is just missing.
Has anybody have had a similar issue with enfold?Thank you in advance.
Best
ST
Hello,
I have been struggling with display errors through the last couple of Enfold updates. I understand it is related to our web host running an older version of WordPress, but I really need help with a workaround. I tried a couple of the solutions I found here in the forums, including replacing the header.php file.I would really appreciate if you could look at this and recommend a fix that would resolve the display issues. Thank you.
In reply to: Not finding Enfold easy at all
Hi Rickard,
I can see what you mean – clicking the link which reads ‘Enfold’ leads to the page which has the “big blue button above the topics, which reads Can’t find a solution to your problem? Open a new thread.” let me say that as a new comer that was not as “obvious to me” as it was to you. Most likely because you knew where to look and what to do. To a new comer that was not “obvious’ nor is it intuitive, you could consider taking this as an insight into the mind of a newcomer rather than a criticism – change or modify the initial ‘support page’ to instruct how you would expect someone to respond such as you do on the ‘enfold’ pagei will look into signing up for gravatar
John
In reply to: How to keep button in one line across all screens
Hey DROR,
Can you try adding this css code in Quick CSS (located in Enfold > General Styling):
#top .av_one_fourth .avia-button.avia-size-x-large { padding: 25px 20px; font-size: 18px; }Hope it helps :)
Best regards,
NikkoIn reply to: Missplaced buttons after upgrade to Enfold 4.2.6
Hi Horst,
I still can’t see anything in private unfortunately. You can verify that is has been sent by visiting this URL on the actual forum: https://kriesi.at/support/topic/missplaced-buttons-after-upgrade-to-enfold-4-2-6/. If you can’t see it there, that means it has not been sent.
Best regards,
RikardEnfold builder product purchase button not working with variable products, states products out of stock, and can not be ordered. Some versions of the product are in stock, all available on back order. But still – out of stock, can’t order.
Please assist, thank you!
//Anders
Hi there, as a live example, see: https://skkynet.com/
The top-most image is a plain or ‘non-interactive’ SVG, inserted as a background in an Enfold color section — ideally, I would like to be able to have functioning SVG links within this image.
Right below the four buttons, look at ‘customers-map.svg’ showing a bunch of logos — some are hyperlinked to case studies. The embedded URLs can be easily added using InkScape or Adobe Illustrator, or by directly editing the SVG file in your favourite text editor. In this example, search inside this SVG for ‘a xlink:ref’ arguments.
To insert this interactive SVG in a code block element:
<object style="width: 100%" type="image/svg+xml" class="responsive-image" data="/media/customers.svg">Your browser does not support SVGs</object>With CSS:
.responsive-image { width: 100%; height: auto; }PS. I believe lightbox is disabled site-wide, if memory serves me.
Hello dear Kriesi Team,
we are working on a website using Enfold. There are a couple of things we couldn’t find the solution for yet,
so I’ll try to describe everything as good as possible.1. Home (Produkte): For a while now there’s an issue with using embedded Cinemagraphs, I am using Flixel Embed codes on some other Enfold-based websites, but on this particular one they disappeared about two weeks ago. There should be a few more on the pages Manufaktur and Team. They even show up in the backend preview. Do you know how to fix that? (IMG 01-a, IMG 01-b) (Link 1, Link 2)
2. Home (Produkte): Is there a way to change the intensity of the mouse-over effect of the Buttons in the full-width video slider? Even though it’s even harder to see it now with the background image (Cinemagraph) not appearing, it would be nice to see it better. (IMG 02)
3. Home (Produkte): I’d love to have the same darkening mouse over effect with slight zoom as seen further below with the Masonry gallery instead of a lightning up effect at the main product examples. (IMG 03)
4. On the page (Link 3) I’d like to change the breadcrums background color to a lighter grey if possible and align the breadcrums text with the last part of the main menu, in this case the search icon. (IMG 04) (Link 3)
5. I’d like to change the color of the vertical black quote bar to another color, ideally to the same yellow as the name. (IMG 05)
6. I’d like to have the round preview pictures removed from the previous and next portfolio button which show up on the sides, not the text though. (IMG 06)
Thank you 10000 times for your help! :)
ThomasIn reply to: Not finding Enfold easy at all
Hi John,
You can start a new thread by navigating to a sub-forum, like Enfold. There you will see a big blue button above the topics, which reads Can’t find a solution to your problem? Open a new thread.
The profile pictures are fetched from Gravatar.
Best regards,
RikardIn reply to: Safari mobile view issue with fullwidth slider
Hi Diezel23,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
#av_section_1 .flex_column.av_one_full.flex_column_div.avia-builder-el-2 + .flex_column_table.av-equal-height-column-flextable { margin-top: 0px !important; } @media only screen and (max-width: 479px) { .av_slideshow_full.avia-slideshow, .av_slideshow_full.avia-slideshow ul { min-height: 230px !important; } .av_slideshow_full li img { min-height: 230px !important; width: 130%; max-width: 130%; } #top .avia-slideshow-button { padding: 10px 11px; display: inline-block; margin-top: 10px; } }If you need further assistance please let us know.
Best regards,
VictoriaIn reply to: Contact Form 7 with Enfold Styles
Hello – my query is for styling with CSS on similar topic to above – using contact form 7.
So far I have added this Quick CSS as below and it mostly looks fine. I used a combination of your ideas above and some from this Tutorial video:- https://www.youtube.com/watch?v=bKarC0QO5og/* Submit Button CSS Styles */
.wpcf7 input[type=submit] {
padding:15px 45px;
background:#FCE228;
color:#232323;
font-size:16px;
font-weight:bold;
border:0 none;
cursor:pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
}/* Submit Button CSS Hover Styles */
.main_color input[type=’submit’]:hover {
background-color: #232323;
color: #FCE228;
}/* Label Text Styles */
.wpcf7 label {
padding: 0 0 10px 0;
font-size: 20px;
color:#232323;
}I want to style further as follows:- Numbered to help your reference :).
1. Make the NAME and EMAIL input fields on same line when the browser width permits. This is how the old Enfold Contact form worked by default. Here’s a screen shot showing ENFOLD default above and CF7 below. I assume it will need to default to stacked on top of each other for mobile view as it does now.
2. My CSS above wasn’t able to add more padding below the label. I tried 20, 40 etc – but it looked just the same. Assuming 20px is the bottom padding?
3. How to add the styling to make the input boxes like my enfold screenshot – with borders coloured #232323 – and with the same rounding as enfold – assume 3px radius?
4. [EDIT- FOUND SOLUTION TO THIS NOW! ] How to add a thin coloured ( #232323) border to the Send button – as I had on the old Enfold contact form? There was also a border colour on the button Hover CSS above but I found it didn’t seem to do anything.
Hope you can help with the above. Much appreciated.
Pete
my website contact form page is here:-
Topic: Problem after upgrade
Hello, after updating the theme enfold I had many problems that I managed to solve but this just can not. It does not show me the css of the buttons and the iconboxes.
The icons do not have the css and the image in the background either.
Take for example this page:In reply to: Button styling
Hey VCS33,
It is not clear what exactly you are trying to achieve. Do check out the docs for button element, I hope this will help you find what you are looking for.
If you still have any issue please point us to the exact page/post and let us know which section of the page we can view the element in question.
Best regards,
VinayHI,
after upgrading enfold from 4.2. to 4.2.6 Buttons are missplaced.
you find more information in the private content section.Best regards
In reply to: Color Section Images Not Responsive …
Hi Blanche,
Thank you.
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (min-width: 768px) and (max-width: 990px) { .html_header_transparency #top .avia-builder-el-0 .slideshow_caption { padding-top: 50px; } } @media only screen and (max-width: 479px) { .avia-slideshow-inner { height: 290px; } .av_slideshow_full li img { height: 290px; width: 175%; max-width: inherit; } #top .avia-slideshow-button.avia-color-light { padding: 7px 10px; margin-top: 15px; } .avia-multi-slideshow-button.avia-slideshow-button { margin-right: 10px; } #top .avia-slideshow-button.avia-color-light.avia-button { font-size: 18px !important; } .responsive #top .slideshow_caption h2 { font-size: 26px !important; } }If you need further assistance please let us know.
Best regards,
VictoriaIn reply to: Change style of product search button
Hi,
Thanks for the feedback. Please try the following in Quick CSS under Enfold->General Styling:
#woocommerce_product_search-3 button { background: #7569c5; padding: 10px 20px; border: none; border-radius: 2px; color: white; }Best regards,
RikardTopic: The product page is broken
Hi there!
The individual product page on my site is broken. It doesn’t respond when I click the picture of the product or the button “View details”
Here’s what the host tells me:
PHP Warning: session_start(): Unable to clear session lock record in /public_shtml/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/masonry_entries.php on line 42How can I solve this issue?
Hi Enfold Team!
Our 4th site with your theme, always a pleasure :)
This time we are developing a Pharmaceutical company site and we need to create a modal popup for some portfolio items, which are prescription drugs. The popup must be a text, something like “This info is for HCPs only… are you a healthcare professional?” with a YES/NO reply in 2 buttons, where YES will take you to the specific portfolio item and NO will take you back to the products page. Cannot have a close button due to regulations on this matter.
In order to provide the client with a clean solution to update products, the modal popup shall trigger based on a portfolio category.
Would it be possible to do this using Magnific popup? Checked a bunch of popup plugins, but cant’t find one that triggers by portfolio category.Thanks!
Hi there,
I just updated to the most recent version of Enfold.
Full Width buttons are displaying incorrectly as seen here: http://yogatrade.com/
And Line breaks are no longer appearing.
Anybody else having these issues?
Thanks!
In reply to: Broken JS and CSS dependencies
Hi, we are also running into slowness issues, requiring us to do some debugging. We have noticed the following broken dependencies:
Broken JS Dependencies
avia_tab_section_js
/wp-content/themes/enfold/config-templatebuilder/avia-template-builder/assets/js/avia-tab-section.js
avia_builder_js (missing)
avia_modal_js (missing)
0.9.5avia_tab_toggle_js
/wp-content/themes/enfold/config-templatebuilder/avia-template-builder/assets/js/avia-tab-toggle.js
avia_modal_js (missing)
0.9.5avia-module-contact
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/contact/contact.js
avia-shortcodes (missing)avia-module-countdown
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/countdown/countdown.js
avia-shortcodes (missing)avia-module-numbers
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/numbers/numbers.js
avia-shortcodes (missing)avia-module-portfolio
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/portfolio/portfolio.js
avia-shortcodes (missing)avia_table_js
/wp-content/themes/enfold/config-templatebuilder/avia-template-builder/assets/js/avia-table.js
avia_modal_js (missing)
0.9.5avia_media_js
/wp-content/themes/enfold/config-templatebuilder/avia-template-builder/assets/js/avia-media.js
avia_element_js (missing)
0.9.5Broken CSS Dependencies
avia-module-button
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/buttons/buttons.css
avia-layout (missing)avia-module-button-fullwidth
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/buttons_fullwidth/buttons_fullwidth.css
avia-layout (missing)avia-module-catalogue
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/catalogue/catalogue.css
avia-layout (missing)avia-module-contact
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/contact/contact.css
avia-layout (missing)avia-module-countdown
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/countdown/countdown.css
avia-layout (missing)avia-module-hr
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/hr/hr.css
avia-layout (missing)avia-module-icon
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/icon/icon.css
avia-layout (missing)avia-module-iconbox
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/iconbox/iconbox.css
avia-layout (missing)avia-module-iconlist
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/iconlist/iconlist.css
avia-layout (missing)avia-module-numbers
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/numbers/numbers.css
avia-layout (missing)avia-module-portfolio
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/portfolio/portfolio.css
avia-layout (missing)avia-module-table
/wp-content/themes/enfold/config-templatebuilder/avia-shortcodes/table/table.css
avia-layout (missing)Hi Support,
After purchasing , installing parent theme, adding and activating child theme and I am yet to understand how to work with enfold.
So I thought I would go to the support page
https://kriesi.at/support/ ( seriously where do you start a new Topic from this link? Maybe I am just blind and cant see the link or button or whatever )
…only to discover I needed to sign up which meant getting my purchase code (more logging in) and then verification via an email then a link to creating a password to creating an account to which I then was required to log in and so on. Good Greif!
So then it was to https://kriesi.at/support/ and guess what no way to start a new thread and ask a question – so then I thought I would use google which ultimately led to this page = again good grief!Back to the actual issue – after the purchase install of enfold and relevant child theme (via ftp) I am none the wiser. I then used the Demo import to import the ‘Consulting Demo” given that was the design layout that persuaded me at purchase time to buy the enfold theme. right or wrongly i had assumed from the theme information that I would be able to use the “Demo” as a template – edit the “Lorem Ipsum” and be up and running with a fresh new look website.
I now doubt that was possible – or is it?
Hello!
I want to make a custom product page and delete “Buy” button and add some things. I got about 500 products so I’m planning to use import plugins. How can I do it? Using the latest Woocommerce and Enfold.In reply to: Google Maps Not Working
Hello Geoff,
I’ve had similar issues and it is quite frustrating. Here’s what I did that solved the issue.
Once you’ve set up a project at Google that will be associated with your specific website… https://console.developers.google.com/ go to the dashboard for that project and click that “Enable APIS and Services” button.Enable the following 3 map APIs in the developer console at Google for the project:
- Google Maps Embed API
- Google Maps Javascript API
- Google Static Maps API
It would be nice if the Enfold team could specify which map APIs will need to be activated in order for a Google Map to work with the theme. In my experience, enabling the Google Static Maps API alone does NOT work.
Kind regards,
RhondaI noticed that when using the Avia Advanced Layout Builder in the Enfold Blog, the Title, Tags, and Social Share Buttons Disappear.
I See there’s a way to get the Social Share Buttons back, albeit manually using the builder element, but The Title and Tags are not automatically generated within the page. Is there a way to set this up so the advanced builder can be used, yet retain all 3 of those elements automatically?
Thanks in advance!
In reply to: Flyout and Submenue Transparency/Opacity
Hi,
Glad everything worked out well! :)
Please feel free to modifications questions, we are always happy to help you!
To remove the border please add the below code
#top #scroll-top-link { border:none!important; }Please check this link to add custom style to the scroll to top
Best regards,
VinayHi,
I need to replicate the contact form in enfold to CF7 in terms of having the email ID box as 2/3rd and Submit button as 1/3rd. I tried to follow the instructions given but am unable to replicate the same style in CF7.Our page link is enclosed below.
Please help.
Thanks
GB
Hello!
I am trying to add a text fade out with a read more link effect to an Iconbox. I found this which works nicely for what I want to do but I haven’t been able to make it work with Enfold.
Here’s what I’ve tried:
– I’ve uploaded the Javascript file to the theme directory (a child theme) and then added this to said child theme’s functions.php:
wp_enqueue_script( 'textfadereadmore', get_template_directory_uri() . '/textfadereadmore.js', array(jquery), true );
– I have added the CSS part in the Quick CSS box of the child theme’s configuration
– In the Iconbox content, HTML tab, I have enclosed the text within a div tag with its corresponding class,<div class="sidebar-box">...</div>, with<p class="read-more"><a href="#" class="button">Read More</a></p>at the end before closing the div tagThe fade out effect seems to work fine, and the text is cut with a “Read more” link appearing in place, but when I click on it the text doesn’t expand.
I tried changing the name of the variables, in case there was a conflict with the Enfold code, but it’s still not working.
Any idea of what might be the issue?Thank you in advance!
_redgeIn reply to: How to make the Health coach theme
Enfold > Advanced Styling > Choose Buttons from the drop down > Edit Element > Adjust the Border Radius.
Enfold > General Styling > Fonts > Body Text
In reply to: How to increase font size of buttons?
