Home Forums Weaver Xtreme Theme Learndash and Weaver Clash

Topic Resolution: Resolved
Viewing 16 posts - 1 through 16 (of 17 total)
  • Author
    Posts
  • #63830
    AdamEmEf
    Participant

    I have an educational site (https://engelsklaslokaal.nl/)for which I use both Weaver Extreme Plus and the plugin Learndash.

    I have some quizzes on the site (made with Learndash). I asked the Learndash Support how I could reduce the height of the boxes of the matrix question which are just too large. See link: https://imgur.com/a/s4YsPZh

    One of the developers answered the following:

    It looks like it’s mostly coming from the Weaver theme:

    https://d.pr/i/sPCrTT

    #content ul, #content ol, #content p { /* margin-bottom: 1.50000em; */ }

    This causes some sort of ‘ripple effect’ that results in a ‘computed’ padding that unfortunately can’t be changed.

    You’ll probably need to create a child theme but I would recommend you to contact Weaver’s support to know what solution they could suggest.

    So I hope one of the Weaver developers (or anybody else) can suggest a solution to me.

    Kind regards,

    Margreet

     

    #63831
    scrambler
    Moderator

    You can add the rule below to the Theme Global Custom CSS Rule box to override the theme default styling for their containers

    #content .wpProQuiz_content ul, #content .wpProQuiz_content ol, #content .wpProQuiz_content p {margin-bottom:0;}

    This is actually a mistake on their part, it is to be expected a theme would have the styling in question, they should have their own overriding rule to enforce styling of their plugin 🙂

    There is still some extra space after that, but not quite sure where it comes from

    #63832
    AdamEmEf
    Participant

    OK. Thanks. I’ll try that and see how it works.

    #63833
    Weaver
    Keymaster

    Just to underline what scrambler said – in the WP world, it is ALWAYS the responsibility of a plugin to add specific rules for the plugin to override any very basic and core rules such as the #content ul, etc. rules that essentially are included in 100% of all themes.

    A plugin that uses such basic things as lists and paragraphs need to provide their own rules if there is a chance the content won’t look right depending on some arbitrary theme.

    #63834
    AdamEmEf
    Participant

    So I did as suggested and while it does help to reduce the height of the boxes of some matrix sorting questions (https://imgur.com/a/QxM2mM3, this is the matrix sorting question I used as an example  (https://engelsklaslokaal.nl/quizzen/amerikaanse-presidentsverkiezingen-quiz/)),

    not all boxes of matrix sorting questions are reduced.  Like this one (https://imgur.com/a/eDrF5w9, link https://engelsklaslokaal.nl/kijk-en-luistervaardigheid-engels/ted-talk-your-body-language-shapes-who-you-are/)

    I have gone back to LearnDash support and passed along your comments 🙂 I hope they will be able to help. If not, I hope you will be able to help me once again.

    #63835
    scrambler
    Moderator

    When I go to https://engelsklaslokaal.nl/kijk-en-luistervaardigheid-engels/ted-talk-your-body-language-shapes-who-you-are/

    The boxes are very compact with no space (tested chrome and edge)

    You may have had a Cache issue, clear all your caches (browser, plugin, hosting…)

    and check again

    #63836
    AdamEmEf
    Participant

    Curiouser and curiouser. I already cleared the cache on the site and on the browser half an hour or so ago (on LearnDash recommendation :)) , but if I go to the first question of the quiz (https://engelsklaslokaal.nl/kijk-en-luistervaardigheid-engels/ted-talk-your-body-language-shapes-who-you-are/), the boxes’height seem to be reduced (but not really compact). And the boxes of the second question are never reduced, neither are the third or fourth. Then, if I go back again to the first question the boxes are too big again.

    #63837
    scrambler
    Moderator

    Still looks prefect to me on all browsers (tried FF too), at least when I just open the link you mentioned.

    If you have a problem at another step, be specific, I cannot do anything with the quiz as I do not understand it, nor does it do anything when I click on the various boxes.

    What browser as you looking in?

    Have your tried different computer and browsers?

    Are you checking when not logged into the WP admin?

    OK I see what you mean, let me check it out

    #63838
    scrambler
    Moderator

    Well I cannot see any reason for the extra space.

    I am suspecting something to do with the way they setup the table or the Flex CSS, but I cant see it.

    Talk to them and let us know what they find.

    #63839
    scrambler
    Moderator

    Just for good measure, add !important to the rule

    #content .wpProQuiz_content ul, #content .wpProQuiz_content ol, #content .wpProQuiz_content p {margin-bottom:0 !important;}

    #63841
    AdamEmEf
    Participant

    Thank you for the suggestion but nothing has changed. Will clear cache once again to see whether that changes anything. LearnDash Support took another look at the site this afternoon but do not understand why the boxes on the right have a minimum height of 100px and will investigate further. Hope to hear sth from them tomorrow. I will let you know what they come up with.

    #63844
    scrambler
    Moderator

    That is indeed what it is, their HTML for the box has an inline style with min-height:100px

    <td width="30%">
                  <ul class="wpProQuiz_maxtrixSortCriterion ui-sortable" style="height: 100px; min-height: 100px;"></ul>
                 </td>

     

    #63850
    Weaver
    Keymaster

    And FYI, it is not possible to override inline styles. That would have to come from the plugin developer. And it is really bad practice to do that.

    #63863
    AdamEmEf
    Participant

    LearnDash came up with the following solution and it works!

    ul.wpProQuiz_maxtrixSortCriterion.ui-sortable {    height: auto !important;    min-height: 0 !important;}

    The height of the boxes of my matrix sorting question have been reduced. Unfortunately, the areas of the right boxes do no longer light up when an answer is dragged there. So not quite there yet! 🙂

    #63877
    Weaver
    Keymaster

    Usually, it is possible to find custom CSS to override content generated by a plugin – as long as the elements have plugin specific classes.

    But fixing issues with plugin is generally not part of the support we can provide for our theme. And it seems that the plugin authors are willing to help you, so that path is probably your best way to get help.

    #63882
    AdamEmEf
    Participant

    I appreciate it very much that you are willing to think along!

    This is the final solution Learndash support came up with: it reduces the height of the boxes and the right boxes still highlight when an answer is dragged.

    body ul.wpProQuiz_maxtrixSortCriterion.ui-sortable {    height: auto !important;    min-height: 0 !important;}
    body .wpProQuiz_content .wpProQuiz_placehold {    height: 30px !important;}

    Hope that it will help other people as well. I can’t be the only one 🙂

Viewing 16 posts - 1 through 16 (of 17 total)
  • You must be logged in to reply to this topic.