Custom shape divider

[Terry.Latey]

I would like to create a custom shape divider. I have a screen shot of the graphic draft of the design at https://drive.google.com/file/d/1RLflVc ... share_link.
Is there someone who could help me with the project?
Terry

[crispy68]

Hi Terry,

Got your email and emailed you back. Your link asks for me to request the docs. I have done so.

[Terry.Latey]

Thank you I did receive your email, thank you for your help. I have found I can create a svg in CorelDraw. But I need to go back and read more of the explanation of how to use the file.
Thank you again,
Terry

[Terry.Latey]

Hi Again,
I am back with the same concerns. I have created another shape within CorelDraw and saved it as a SVG. I must not be saving it with the proper settings because it just sits at the bottom of the flex container, small and black. When saving a SVG are there specific settings for the web?
Terry

[crispy68]

I wouldn't say there are specific settings for an SVG but there some things it does need to have (ex: viewBox). Without actually seeing your SVG, it's hard to say what your issue is. To use it in WB via the divider tab, there is some code that needs added to work. Maybe this will help: https://www.wysiwygwebbuilder.com/shape_dividers.html

[BaconFries]

When saving a SVG are there specific settings for the web?

Unfortunately we cannot assist with how to use Coreldraw and what settings you should use to save as a svg. I would suggest you contact the following https://community.coreldraw.com/talk/ where help will be given.

[Terry.Latey]

Thank you for the advice to visit the CorelDraw forum. They don't seem to have an answer thus far. I have copied the code of my SVG. It is below, is this helpful to determine the problems I am having?

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010 ... /svg10.dtd">
<!-- Creator: CorelDRAW 2021 (64-Bit Not for commercial use) -->
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="8.53233in" height="4.37636in" version="1.0" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
viewBox="0 0 8502.65 4361.14"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
<defs>
<style type="text/css">
<![CDATA[
.fil0 {fill:black;fill-rule:nonzero}
]]>
</style>
</defs>
<g id="Layer_x0020_1">
<metadata id="CorelCorpID_0Corel-Layer"/>
<path class="divider-fill" d="M8500.86 2883.32c0.45,-84.26 1.79,-233.54 1.79,-233.54 -129.39,1.65 -408.58,-2.64 -887.5,-1.48 -398.71,0.97 -765.9,-0.45 -797.41,-1.18 -230.63,-5.37 -415.11,14.31 -679.34,-73.73 -131.16,-43.7 -253.87,-253.12 -303.86,-327.9 -190.36,-284.74 -362.55,-371.09 -575.24,-345.18 -146.14,17.8 -280.27,151.66 -407.05,177.82 -187.84,38.76 -341.89,15.42 -444.94,-91.37 -156.49,-162.19 -144.72,-160.71 -268.63,-299.63 -49.98,-56.04 -209.85,-239.59 -250.01,-286.95 -189.14,-223.06 -458.36,-467.55 -752.02,-437.02 -17.27,1.07 -34.41,3.77 -51.32,8.09l-0.42 0.09 -0.01 -0c-73.69,14.07 -208.22,45.44 -322.11,95.53 -194.17,85.41 -380.36,204.51 -479.46,234.71 -66.2,20.17 -295.45,9.32 -365.74,-57.06 -29.57,-27.92 -203.78,-182.3 -273.7,-272.18 -89.19,-114.66 -194.17,-315.12 -321.02,-500.3 -50,-72.99 -96.53,-127.11 -160.75,-183.72l-133.79 -117.84 -123.66 -77.92 -110.38 -50.43 -34.62 -13.77c-57.3,-25.99 -125.6,-27.95 -190.03,-27.87 -335.26,-17.53 -569.65,444.91 -569.65,444.91l0 2235.53 0 241.68 0 750.08 0 688.45 8500.86 0 0 -1477.81z"/>
</g>
</svg>

[crispy68]

@Terry,

I use inskape and they have an option when you save it to save it as a stripped down/optimized .svg. This removes a lot of the junk that gets added like I see in yours. Maybe CorelDraw has a similar option?

I removed all the clutter and came up with this:

<svg xmlns="http://www.w3.org/2000/svg" version="1.0" viewBox="0 0 8502.65 4361.14" preserveAspectRatio="none">
<g><path class="divider-fill" d="M8500.86 2883.32c0.45,-84.26 1.79,-233.54 1.79,-233.54 -129.39,1.65 -408.58,-2.64 -887.5,-1.48 -398.71,0.97 -765.9,-0.45 -797.41,-1.18 -230.63,-5.37 -415.11,14.31 -679.34,-73.73 -131.16,-43.7 -253.87,-253.12 -303.86,-327.9 -190.36,-284.74 -362.55,-371.09 -575.24,-345.18 -146.14,17.8 -280.27,151.66 -407.05,177.82 -187.84,38.76 -341.89,15.42 -444.94,-91.37 -156.49,-162.19 -144.72,-160.71 -268.63,-299.63 -49.98,-56.04 -209.85,-239.59 -250.01,-286.95 -189.14,-223.06 -458.36,-467.55 -752.02,-437.02 -17.27,1.07 -34.41,3.77 -51.32,8.09l-0.42 0.09 -0.01 -0c-73.69,14.07 -208.22,45.44 -322.11,95.53 -194.17,85.41 -380.36,204.51 -479.46,234.71 -66.2,20.17 -295.45,9.32 -365.74,-57.06 -29.57,-27.92 -203.78,-182.3 -273.7,-272.18 -89.19,-114.66 -194.17,-315.12 -321.02,-500.3 -50,-72.99 -96.53,-127.11 -160.75,-183.72l-133.79 -117.84 -123.66 -77.92 -110.38 -50.43 -34.62 -13.77c-57.3,-25.99 -125.6,-27.95 -190.03,-27.87 -335.26,-17.53 -569.65,444.91 -569.65,444.91l0 2235.53 0 241.68 0 750.08 0 688.45 8500.86 0 0 -1477.81z"/></g>
</svg>