Adding text and/or images to header 71.

I am working on the new Squarespace 7.1 version of the website editor. I need to add text and a small image in the upper right-hand corner of the web page. I cannot seem to find a way to perform this action. Ideas have been suggested to use custom code or a CSS trick to accomplish this task. However, no clear path has been defined.

I have attached an example of a WordPress "header" I am attempting to migrate from and what I have on the new site on being reconstructed on Squarespace.

Note: I blurred out this request's business phone number and name.

Any suggestions are welcome!

Tricky to do in just css with that layout. Maybe some JS to swap out default styles would be the way to go. Here's a basic css method to 'inject' content into the header using the button element to attach extra text and an icon:

.header-actions-action .btn{display:inline;} //just so the text below lines up vertically with the button middle

.header-actions-action::before {
  content: "\f05b"; white-space: pre;color:inherit; font-family: 'Material Symbols Outlined'; font-weight:900; margin-left: 10px;text-align:left; float:left; display:inline-block;} // if want the icon, you'll need to add the @media call for the font-family in the css (above) for the Material icon font, as well as the link to the Google Material Icon font in Custom Code... see Google Icons for details.

.header-actions-action::after {
  content: "Verteran owned & operated \a" attr(title); white-space: pre; color:inherit; font-weight:900;margin-left: 5px;margin-right: 15px;float:left; display:inline-block;}

I appreciate the timely response, Simon! I will look into trying this in CSS.