Essence Pro: Editing the line element connecting Hero and Body section

[leoleoso]

Hi all,

The Essence Pro theme has an element (A line) that connects the hero section and the body section for must pages in Desktop. You can edit the color of this line when you change the general theme color.

However, is it possible to make this line an SVG instead? Does anyone know how I could edit the code to do so?

Thanks!

-- Leo

https://demo.studiopress.com/essence/layouts/

[Victor Font]

You need to be more specific as to which line. I can't tell what your asking about in your post.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[AnitaC]

That line code can be found around line 719 of the stylesheet. I'm not sure how to apply an SVG image to that area, but it uses a "height, width and background color" to form that line.

.error404 .site-inner::before,
.page .site-inner::before,
.single .site-inner::before {
    background-color: #a86500;
    content: "";
    display: block;
    height: 100px;
    margin: 0 auto;
    position: relative;
    top: -50px;
    width: 2px;
    z-index: 9;
}

---

Need help with customization or troubleshooting? Reach out to me.

[leoleoso]

Thank you, Anita! That's exactly it! What about a PNG image? Is there a way to do that with CSS?

[AnitaC]

You can. The URL would go on the content line.

content: (YOUR URL HERE);

...with the all the other CSS. You'd have to work that out based on your image.

Read this.

---

Need help with customization or troubleshooting? Reach out to me.

[leoleoso]

You are the best! That's exacty what I wanted! thank you!

You might be able to see it here: https://justsoantsy.com/wp-content/uploads/2019/11/antsy-divider.png

[AnitaC]

You're welcome!

---

Need help with customization or troubleshooting? Reach out to me.

[Author]

Posts