Need to shift Checkfront info to the left (about 15px)

Hi, I am using check front to deal with the courses on the site above. When i enter the shortcode the information pads in to the right by about 15px. I need to bring it back so it lines up nicely (pls see pic attached)

Many thanks

  • Adam Czajczyk
    • Support Gorilla

    Hello Studio3creative,

    I hope you're having a nice day and thank you for your question!

    This code should remove left padding there:

    div#sidebar-wrapper.sidebar.max.min.col-xs-12.col-md-3 {padding-left:0;}

    There's a little "trick" however that may be necessary in case it didn't work "out of the box". Since your theme is built upon Bootstrap this code has to be called after the bootstrap CSS is loaded, otherwise it may not work.

    Please try adding it first to your Custom CSS box via "Appearance" page or theme settings in dashboard and if this doesn't help you may need to create a basic child-theme of your current theme and apply the code to its style.css file.

    I hope that helps!
    Best regards,

  • Adam Czajczyk
    • Support Gorilla

    Hello Studio3creative!

    The code I shared with you works for me when added via browser's CSS editor (in Firefox). However, as I mentioned before, the bootstrap CSS seems to be overriding it (even if used with "!important;" flat) if its added before "bootstrap.css" is loaded.

    What you could however try alternatively (to make sure that this style is loaded as very last), would be an MU plugin. Give it a shot please:

    - create an empty file with a .php extension (e.g. "move-shortcode-left.php")
    - put following code inside:

    function wpmu_move_shortcode_left() {
    div#sidebar-wrapper.sidebar.max.min.col-xs-12.col-md-3 {padding-left:0!;}
    add_action('wp_footer', 'wpmu_move_shortcode_left', 99);

    - upload the file to the "/wp-content/mu-plugins" on your server via FTP

    This should add that css rule directly to site's footer, loading it as late as possible. Hopefully, this would overwrite default bootstrap style.

    Let me know if it worked!
    Best regards,

    • Brandon
      • New Recruit

      Hello Studio3creative,

      I happened onto your post, decided I would sign-up and answer the questions you are having. The targeted CSS is having a difficult time dealing with the class/id's because it is content within an iframe. Using PHP to try and handle this will result in the same problems as the previously provided css.

      To fix your issue:

      1. After logging into your Checkfront App navigate to -> /manage/layout/css/
      2. Enter this css:

      #sidebar-wrapper, #content{

      3. Go back to your website and view the css change. The padding will be gone.
      4. For specific support around Checkfront products I would suggest using the Checkfront Forums . The community or support staff will be able to assist you much more efficiently.

      Any specific styling you want to do to the iframe page should be done within this override file.

      Good Luck!

  • Milan
    • WordPress Wizard

    Hello Studio3creative,

    Please try out solution explained by our community member Brandon ,( thanks Brandon :slight_smile: ) If it doesn't work too, Would you please grant me support staff access so that I can check in depth regarding your concern ?. You can grant me support access via WPMU DEV > Support > Support Access > Grant Access.

    Best Regards,

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.