Single Product Page on Upfront Theme - Huge Empty Space

There's a HUGE empty portion at the bottom. Where do I add the code (as mentioned in this thread: https://premium.wpmudev.org/forums/topic/marketpress-single-product-page-on-upfront-theme#post-1046692).

.mp-multiple-products.mp_product_tab_content.mp_product_tab_content-related-products {bottom: 0;}
.mp-multiple-products.mp_product_tab_content.mp_product_tab_content-related-products.mp_product_tab_content-current{bottom:initial;}
  • Adam Czajczyk
    • Support Gorilla

    Hello Princessa,

    I hope you're well today and thank you for your question!

    To apply this code to your site please open any page of it (not necessarily a product page, may be a homepage as well) in your browser and then:

    - enable Upfront editor
    - in an Upfront panel on the left click on "Theme setings"
    - click on "add custom custom css rules"
    - scroll the content of a code editor (that pops out at the bottom of the screen) all the way down
    - add that code there
    - save editor and save Upfront

    Alternatively, you may try to apply it a bit simpler way by installing "Simple Custom CSS" plugin and then putting the code into the "Custom CSS" text box on "Appearance -> Custom CSS" page in your dashboard.

    Best regards,
    Adam

  • Predrag Dubajic
    • Support

    Hi Princessa,

    You are referring to multiple sites in your network, right?

    There's no option in Upfront to do this but you can use custom solution.

    Create new .php file in your wp-content/mu-plugins/ folder, you can name it whatever you want, for example marketpress_css_fix.php and place this code in that file:

    <?php
    // Add items to the header!
    function wpmu_global_css() {
    	echo "<style>
    			.mp-multiple-products.mp_product_tab_content.mp_product_tab_content-related-products {bottom: 0;}
    			.mp-multiple-products.mp_product_tab_content.mp_product_tab_content-related-products.mp_product_tab_content-current{bottom:initial;}
              </style>";
    }
    add_filter('wp_head', 'wpmu_global_css');

    And if you don't have mu-plugins folder already simply create it yourself :slight_smile:

    Let us know if this worked for you.

    Best regards,
    Predrag

  • Adam Czajczyk
    • Support Gorilla

    Hello Princessa,

    I hope you're well today!

    Are you referring to this gap marked on a screenshot below?

    Try using this code instead (replace the one recently given by Predrag):

    <?php
    // Add items to the header!
    function wpmu_global_css() {
    	echo '<style>
    			.mp-multiple-products.mp_product_tab_content.mp_product_tab_content-related-products {bottom: 0;}
    			.mp-multiple-products.mp_product_tab_content.mp_product_tab_content-related-products.mp_product_tab_content-current{bottom:initial;}
    			.mp .upfront-region-container-post-comments {display:none;}
              </style>';
    }
    add_filter('wp_head', 'wpmu_global_css');

    Let me know if it helped, please!
    Best regards,
    Adam

  • Adam Czajczyk
    • Support Gorilla

    Hello Princess!

    I just noticed that the code got "scrambled" in my post, sorry about that. That's great that you were able to spot that and make correction, I have also already corrected the code in my post just in case anybody else would like to make use of it.

    Thanks for letting me know!

    Have a nice day,
    Adam

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.