How to add a back button from current to previous page for Dawn Theme

[NatalieY123]

How to add a back button from current page to the previous page for at the left side right under the announcement bar for Dawn Theme? 

[Nilankar]

Hi! @NatalieY123 
Regarding the back button placement in the Dawn theme,
This typically involves modifying the theme’s file to ensure proper styling and functionality.
Here’s how it would look:

[NatalieY123]

Thanks for your reply, how to make this change?

[Nilankar]

This isn't a built-in feature of the Dawn theme, but it can be customized by modifying the theme files.
It's best to have a developer handle this to ensure proper implementation and avoid potential debugging issues.

[NatalieY123]

I see. How about if just add the back button (back to previous ) in collection page and product page?

[Nilankar · Accepted solution]

Yes, it's definitely possible to add a back button only on the collection and product pages. 

here is button Ui code

<style>
        .back-button {
          position: absolute;
          top: 50%;
          left: 0;
          transform: translateY(-50%);
          display: inline-flex;
          align-items: center;
          justify-content: center;
          width: 36px;
          height: 36px;
          border-radius: 50%;
          /* background: linear-gradient(145deg, #f0f0f0, #e6e6e6);
          box-shadow: 4px 4px 8px #d1d1d1, -4px -4px 8px #ffffff; */
          border: none;
          color: #555;
          font-size: 18px;
          cursor: pointer;
          transition: all 0.3s ease;
          outline: none;
        }
        .back-button:hover {
          background: linear-gradient(145deg, #e6e6e6, #f0f0f0);
          color: #333;
        }
       .back-button:active {
          box-shadow: inset 4px 4px 8px #d1d1d1, inset -4px -4px 8px #ffffff;
        }
      </style>
      <button onclick="window.history.back()" class="back-button">
        <svg
          xmlns="http://www.w3.org/2000/svg"
          xmlns:xlink="http://www.w3.org/1999/xlink"
          fill="black"
          height="800px"
          width="800px"
          version="1.1"
          id="Capa_1"
          viewBox="0 0 26.676 26.676"
          xml:space="preserve"
        >
          <g>
              <path d="M26.105,21.891c-0.229,0-0.439-0.131-0.529-0.346l0,0c-0.066-0.156-1.716-3.857-7.885-4.59   c-1.285-0.156-2.824-0.236-4.693-0.25v4.613c0,0.213-0.115,0.406-0.304,0.508c-0.188,0.098-0.413,0.084-0.588-0.033L0.254,13.815   C0.094,13.708,0,13.528,0,13.339c0-0.191,0.094-0.365,0.254-0.477l11.857-7.979c0.175-0.121,0.398-0.129,0.588-0.029   c0.19,0.102,0.303,0.295,0.303,0.502v4.293c2.578,0.336,13.674,2.33,13.674,11.674c0,0.271-0.191,0.508-0.459,0.562   C26.18,21.891,26.141,21.891,26.105,21.891z"/>
              <g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g>
              </g>
          </g>
        </svg>
      </button>

[NatalieY123]

Where should I put those code in order to put in collection page and product page?