Title: shop page code question
Last modified: February 28, 2025

---

# shop page code question

 *  Resolved [ohmykomu](https://wordpress.org/support/users/ohmykomu/)
 * (@ohmykomu)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/shop-page-code-question/)
 * I have added product attributes to the shop page with the code below but I need
   to change the spacing, Ideally I need less room above and below the attribute,
   please see screenshot [https://snipboard.io/GYSi0c.jpg](https://snipboard.io/GYSi0c.jpg)
 *     ```wp-block-code
       add_action('woocommerce_after_shop_loop_item_title', 'display_custom_product_attributes_on_loop', 5 );function display_custom_product_attributes_on_loop() {    global $product;    // Settings: Here below set your product attribute label names    $attributes_names = array('Från');    $attributes_data  = array(); // Initializing    // Loop through product attribute settings array    foreach ( $attributes_names as $attribute_name ) {        if ( $value = $product->get_attribute($attribute_name) ) {            $attributes_data[] = $value;        }    }    if ( ! empty($attributes_data) ) {        echo '<div class="items" style="color: black; font-size: 12px;"><p>' . implode( '<br>', $attributes_data ) . '</p></div>';    }}
       ```
   
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fshop-page-code-question%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 1 replies (of 1 total)

 *  Plugin Support [shahzeen(woo-hc)](https://wordpress.org/support/users/shahzeenfarooq/)
 * (@shahzeenfarooq)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/shop-page-code-question/#post-18336106)
 * Hi there!
 * The space is caused by the default **margin**-bottom applied to the `<p>` tag.
   To remove this space, you’ll need to set the `margin-bottom` to **0px** in the
   code where the `<p>` tag is being added.
 * Alternatively, you can use the following custom CSS code:
 *     ```wp-block-code
       .woocommerce-shop  .items p{    margin-bottom: 0px !important;}
       ```
   
 * I hope this helps. Please note that, generally, we do not provide support for
   customizations. If you need more in-depth support or want to consider professional
   assistance for customization, I can recommend [WooExperts](https://partners.woocommerce.com/English/marketplace/)
   and [Codeable.io](https://woocommerce.com/codeable/) as options for getting professional
   help. Alternatively, you can also ask your development questions in the [ WooCommerce Community Slack](https://woocommerce.com/community-slack/)
   as custom code falls outside our usual [scope of support](https://woocommerce.com/support-policy/#customization).

Viewing 1 replies (of 1 total)

The topic ‘shop page code question’ is closed to new replies.

 * ![](https://ps.w.org/woocommerce/assets/icon.svg?rev=3234504)
 * [WooCommerce](https://wordpress.org/plugins/woocommerce/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/woocommerce/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/woocommerce/)
 * [Active Topics](https://wordpress.org/support/plugin/woocommerce/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/woocommerce/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/woocommerce/reviews/)

## Tags

 * [attributes](https://wordpress.org/support/topic-tag/attributes/)
 * [Shop page](https://wordpress.org/support/topic-tag/shop-page/)

 * 1 reply
 * 2 participants
 * Last reply from: [shahzeen(woo-hc)](https://wordpress.org/support/users/shahzeenfarooq/)
 * Last activity: [1 year, 3 months ago](https://wordpress.org/support/topic/shop-page-code-question/#post-18336106)
 * Status: resolved