Enfold Theme Issues

Support has been upgraded!



The Support Forum is closed. Not to worry!  Providing the top quality support you expect and we're known for will continue! We're not ending support, just changing where you submit requests. This will provide you with the best experience possible.

Premium Support

Have you purchased an addon for Connections such as one of our premium templates or extensions with a valid license and you need help?

Please open a Support Ticket in your user account.

Click here to open a support ticket.

Free Support

Are you using the free Connections plugin? Don't worry, you are still very important to us! We are still providing you with the same high quality support that we're known for.

Please open a new support topic in the WordPress support forums for Connections.

Click here to open a support topic.

This topic is: resolved

Tagged: , , , ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • 07/12/2016 at 3:26 pm #382520
    Lane Lee
    Participant

    I am using Enfold theme and just purchased the complete connections packages. I installed the slim template and the listings look ok but, the ‘Select Category’ dropdown at the top is not responsive and goes full width behind other elements. It also has strange displays strange xx oo charecters when I hit the select drop down. Is this a Enfold theme conflict? Can it be fixed?

    http://reachmedia.us/nda/faculty-staff/

    07/12/2016 at 4:38 pm #382525
    Steven Zahm
    Keymaster

    @ Lane

    re: Is this a Enfold theme conflict?

    I do not think so as others use it with Enfold without issue.

    re: the ‘Select Category’ dropdown at the top is not responsive and goes full width behind other elements.

    This is due to a CSS style being applied by the theme. It is globally setting all select drop downs to be 100% width.

    This should be able to fixed by applying a custom CSS declaration to override the theme. Add the following to the theme’s custom CSS area:

    select.cn-category-select.cn-enhanced-select {
    width: auto;
    max-width: 250px;
}

    re: It also has strange displays strange xx oo charecters when I hit the select drop down.

    I’m not seeing this… can you post a screenshot with exact steps to reproduce?

    07/13/2016 at 7:50 am #382622
    Lane Lee
    Participant

    Steven,
    Thanks so much that fixed the 100% width problem! Attached screen of ‘random’ charecters in that drop down.

    Strange it looks like a browser bug? Seems ok in Firefox but, in Chrome and Safari it shows up..
    Thanks!

    Attachments:
    You must be logged in to view attached files.
    07/13/2016 at 10:31 am #382659
    Steven Zahm
    Keymaster

    @ Lane

    re: Strange it looks like a browser bug? Seems ok in Firefox but, in Chrome and Safari it shows up..

    Interesting, when I visited yesterday, I did so using Chrome and did not see it. Today in Chrome I still do not see it. So I tried IE 11 and Firefox. I do not see it in those browsers either.

    Looking thru the page source I see another area where the theme seems to be stomping on the styles for the drop down.

    Try adding the following to the theme’s custom CSS area:

    #cn-list .chosen-container-single .chosen-search input[type=text] {
    margin: 1px 0;
    padding: 4px 20px 4px 5px;
    width: 100%;
    height: auto;
    outline: 0;
    border: 1px solid #aaa;
    background: #fff url(chosen-sprite.png) no-repeat 100% -20px;
    background: url(chosen-sprite.png) no-repeat 100% -20px;
    font-size: 1em;
    font-family: sans-serif;
    line-height: normal;
    border-radius: 0;
}

    Not sure if that will fix it for you or not but I think it is worth a try.

    Also, I would suggest reaching out to the Enfold support team. They add an id to the <body> tag of top then they style items such as selects using that ID as a selector. Doing so makes it more difficult (than it has to be) to apply styles which override it. It would beneficial for them to remove that ID and apply their CSS selectors to the classes instead of those elements instead. The way it is now, their CSS will override lots of plugins making them not not look correct causes little display issues like these. My only option to address this would to be to include a lot more CSS (roughly 500 lines) needlessly.

    Hope that helps, let me know.

    07/13/2016 at 10:37 am #382666
    Lane Lee
    Participant

    That worked! Thanks for the GREAT support!

    FYI- I did see this same issue on some of the example ‘showcase’ sites so they may need this code as well.

    07/13/2016 at 1:25 pm #382679
    Steven Zahm
    Keymaster

    @ Lane

    I was thinking after sending my previous reply, I could detect Enfold and load an additional CSS file designed specifically to override Enfold would you like to give this a test?

    07/13/2016 at 1:31 pm #382681
    Lane Lee
    Participant

    ITs working now but, I can try it if it might help you. Couldn’t you just add the above CSS to your plugin and that would cover it if they use Enfold or not?

    07/13/2016 at 2:58 pm #382702
    Steven Zahm
    Keymaster

    @ Lane

    Technically, yes…

    The enhanced select drop down is a jQuery library called Chosen which has its own JS and CSS files which are loaded. It is these CSS declaration that Enfold is stomping all over. The real fix is for Enfold to fix how they declare the styles as it is not only affects Connections, they are breaking other plugin which use it too. Many plugins use this library.

    Including Chosen specific CSS in my own CSS means I then need to ensure my CSS does not break Chosen when Chosen is updated whether it be in Connections or another plugin. My solution mentioned in my previous reply it is not great for the exact same reasons I just mentioned but at least the downsides are specifically limited to Enfold rather than globally to users of all other themes. And when it does break all I’ll need to do is grab the current Chosen CSS and prefix it with a Connections ID again. So from a management/risk scenario this is better even though I really do not like it (as a solution).

    I’m going to include this in the next update and see how it goes. Here are the changes if you are interested:

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)

You cannot reply to this support topic. Please open your own support topic.