New Shopify Certification now available: Liquid Storefronts for Theme Developers

Add Shaped Texture to Section Borders

mkrakower
Tourist
5 0 1

I am looking to add a shape effect to some section borders on my store. Like the second section here: https://www.eatbanza.com/. Animation would be nice but is not necessary. 

 

Does anyone know the CSS code to achieve this and exactl

Replies 2 (2)
PaulNewton
Shopify Partner
5931 537 1241

If you need a customization like that including animation then contact me directly by mail for services.
Please always provide context, examples: store url, theme name, post url(s) , or any further detail.
Contact Info in signature.

 

If it's a styled spacer between sections just add a custom-liquid section between the other sections using code roughly like below where you add a url from an image used for the background, or replace it with some advanced code for CSS based shapes:

{% assign background_asset_url = "" %}
<div class="styled_seperator"></div>
<style>
.styled_seperator {
    position: relative;
    top: -10px;
    left: 0;
    right: 0;
    display: block;
    height: 10px;
    background: url( {{ background_asset_url }}) repeat-x;
    background-size: 20px 20px;
    background-position: 0 0;
}
</style>

 

Good Hunting.

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


mkrakower
Tourist
5 0 1

Thanks Paul, I understand the concept but I am struggling with the image link. The image (one crest of the wave) is uploaded to my content Files and I am using the link provided there. Any idea why the code is returning a syntax error? See screenshot attached.