Image with Text Button - Capital Theme

Store Design
, ,
2

Hi @Caroline83 Welcome to the Shopify community, without looking into your theme files, it’s not possible to provide you the exact code and where exactly you need to add that code, but I can provide you the base code so that you can edit it according to your theme and then use it.

  • Identify Image with Text Section: In your Shopify admin panel, go to “Online Store” > “Themes” > “Customize” for the Capital Theme. Navigate to the page or section where you want to add the button.

  • Edit Section Code: In the theme customization interface, there should be an option to edit the section code for the Image with Text section. Look for an option like “Edit code” or “Edit section.”

  • Add Button Code: Within the section code, find the section responsible for displaying the text and image. You’ll need to add HTML markup for the button below the text. Here’s an example:


  
  

Your text goes here

  Button Text

Replace “Your text goes here” with your actual text content and “Button Text” with the text you want on the button.

  • Add CSS Styling: To style the button as per your requirements, you’ll need to add custom CSS. Here’s an example of how you can style the button:
.custom-button {
  display: block;
  margin: 0 auto; /* Center the button */
  background-color: #333333;
  color: #FFFFFF;
  font-family: "Century Gothic", sans-serif;
  font-weight: normal;
  text-align: center;
  padding: 10px 20px;
  text-decoration: none;
}

.custom-button:hover {
  background-color: #555555;
}
  • Save Changes: After adding the button code and CSS styling, save your changes in the theme editor.

If you will unable to implement the same then I’m happy to do this for you, let me know. I can implement the code changes so that this will work well for you.

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

Best Regards

Sahil