# Collections List Section 1. From your Shopify admin, go to **Online Store** **->** **Themes**. 2. Find the theme that you want to edit, and then click **Customize**. 3. Choose **Collections list** from the dropdown window. ![](/files/ix1ZUQtMca4qKgSNA6DO) | Setting | Description | | ------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------- | | Background Color | Set the background color for the section | | Background Gradient | Set the background gradient for the section | | Show Breadcrumb? | Enable to show the page breadcrumb. | | Breadcrumb: Alignment | Align Breadcrumb to either to be center, to the left or right. | | Background Color | Set the background of the breadcrumb on Desktop. | | Background Gradient | Set the gradient of the breadcrumb on Desktop. | | Background Color Mobile | Set the background of the breadcrumb on Mobile. | | Background Gradient Mobile | Set the gradient of the breadcrumb on Mobile. | | Show Page Title? | Enable to show the page title. | | Page Title: Alignment | Align the Page Title to the center, to the left or right. | | Title Spacing Top | Determine the spacing of the title from the top. | | Title Spacing Bottom | Determine the spacing of the title from the bottom. | | Description | Fill in the description of the page. | | Content: Alignment | Align the description to the center, to the left or right. | | Font Size | Determine the font size of the description. | | Font Size Mobile | Determine the font size of the description on Mobile. | | Font Weight | Select the Font weight of the description. | | Spacing Top | Determine the spacing top of the description. | | Spacing Bottom | Determine the spacing bottom of the description. | | Text Color | Set the color for the description text. | | Layout | Select the layout for the page to be either: Default (Adapt to the Body Width), FullWidth (regardless of the Body Width), and Width 1770px. | | Spacing top - Desktop / Tablet / Mobile | Determine the spacing of the section from the top on Desktop, Tablet and Mobile. | | Spacing bottom - Desktop / Tablet / Mobile | Determine the spacing of the section from the bottom on Desktop, Tablet and Mobile. | ### Sidebar | Setting | Description | | ----------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | Show Sidebar? | Enable to show sidebar. Note that blocks rather than Custom Collection must be added for the sidebar to appear. | | Show Collapsible Block? | Turn the blocks in sidebar to be collapsible. | | Enable Sticky? | Fix the position of the sidebar when scrolling until the end of the collection content. | | Layout | Determine how collapsible blocks are presented: Layout 1 (The collapsible blocks appear with carets), Layout 2 (The collapsible blocks appear with minus and plus icons) | | Collapsible | Select the collapse state of the collapsible blocks when the page loads. | | Position | Select the position of the side to be either to the Left or Right. | | Select Font Type | Select the font family for the title of the sidebar. | | Font Size | Determine the font size of the title of the sidebar. | | Font Weight | Select the font weight of the title of the sidebar | | Text Transform | Select the text transform for the title of the sidebar | | Font Style | Select the font style of the title of the sidebar. | #### COLLECTION LIST | Setting | Description | | ------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Type | Select the type of the collection to display in the list: All Collection (Dynamically fetch data from the admin), Custom Collections (Set up with Custom Collection Block) | | Sort by | Change the order of the All Collection Type with criteria. | | Item Per Row | Select the number of collections to show per row. | | Item Per Row Mobile | Select the number of collections to show per row on Mobile. | | Spacing Top | Determine the spacing top of the collection list. | | Spacing Bottom | Determine the spacing bottom of the collection list. | | Grid Gap | Determine the gap between collections. | | Item Content Side Padding | Determine the padding left and right of the collection content including title, product amount and description. | | Maximum Collections To Show | Limit the number of collections to show. | | Show 'Show More' Button? | Enable to show the 'Show More' button. | | Button | Fill in the text for the show more button. | | Button Font Size | Determine the font size of the button. | | Button Width | Specify the width the load more button from 100px to 600px. | | Button Font Weight | Select the font weight of the load more button. | | Text Transform | Select the text transform of the load more button. | | Spacing Top | Determine the spacing of the button from the top. | | Spacing Bottom | Determine the spacing of the button from the bottom. | | Color - Background Color - Background Gradient - Border Color | Set the text color, background and border color for both normal and hover states of the load more button. | #### COLLECTION IMAGE | Setting | Description | | --------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Image Ratio | Select the desired ratio of the image: Adapt to Image (the original image width and height are adopted), Portrait (the image is cropped to be portrait), Square (the image is cropped to be square) | | Portrait Aspect Ratio | Determine the ratio between width and height of the image if the Image Ratio: Portrait is selected. | | Spacing Bottom | Determine the spacing of the image from the bottom. | #### COLLECTION CONTENT | Setting | Description | | ------------------------------ | ----------------------------------------------------------------------------------------------------------------- | | Show Collection Title | Enable to show the collection title on all collection items. | | Show Collection Product Count? | Enable to show the collection product amount on all collection items. | | Content: Alignment | Align the collection content including title, number amount, description and button to the Left, Right or Center. | | Border Color | Set the color for all of the collection items' border. | | Background Color | Set the color for all of the collection items' background. | | Background Gradient | Set the background gradient for all of the collection items' background. | #### TITLE | Setting | Description | | ------------------- | ----------------------------------------------------------------------- | | Font Size | Determine the font size of the title on all collection items. | | Font Size Mobile | Determine the font size of the title on all collection items on Mobile. | | Font Weight | Select the font weight of the title on the collection items. | | Text Transform | Select the text transform of the title on the collection items. | | Title Font Style | Select the font style for all the collection items' titles. | | Spacing Bottom | Determine the spacing bottom of the collection title. | | Text Color | Set the color for the collection title. | | Background Color | Set the background color for the collection title. | | Background Gradient | Set the background gradient for the collection title. | #### THE NUMBER OF PRODUCTS | Setting | Description | | ---------------- | ------------------------------------------------------------------------------- | | Font Size | Determine the font size of the product count on all collection items. | | Font Size Mobile | Determine the font size of the product count on all collection items on Mobile. | | Font Weight | Select the font weight of the number count. | | Text Transform | Select the text transform for the number count. | | Spacing Bottom | Determine the spacing bottom of the product count. | | Text Color | Set the color for the product count. | #### DESCRIPTION | Setting | Description | | ----------------- | --------------------------------------------------------------------------- | | Font Size | Determine the font size of the description. | | Font Size Mobile | Determine the font size of the description on Mobile. | | Font Weight | Select the font weight of the description. | | Text Transform | Transform the description to be Normal, Capitalize, Uppercase or Lowercase. | | Description Limit | Limit the description word count to truncate. | | Spacing Bottom | Determine the spacing bottom of the description. | | Text Color | Set the color for the description. | #### BUTTON The settings below are for the buttons in the collection content block. | Setting | Description | | ------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------- | | Button | Enter the text for the button. Eg: Read More | | Button Style | Select the style of the button: Style 1 - normal button; Style 2 - as a Link | | Button Font Size | Determine the font size of the button. | | Button Width | Determine the width of the button. | | Button Font Weight | Select the font weight of the button. | | Text Transform | Transform the text of the button to be either normal, uppercase, lowercase or capitalize. | | Spacing Bottom | Determine the spacing bottom of the button. | | Color - Background Color - Background Gradient - Border Color | Set the text color, background and border color for both the normal and hover states of the buttons. | --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://halosoft.gitbook.io/bonnita-documentation/collections-list-page/collections-list-section.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.