Using Inline SVG and JavaScript Gradients in an Evolution CMS Theme

This scenario came from a project that used inline SVG for a stylized headline effect and relied on JavaScript to build the gradient and text nodes. The idea may feel dated now, but it reflects a real frontend pattern from the period: use Evolution CMS for content, then let JavaScript finish advanced visual rendering.

Example SVG shell

<svg class="svg" height="25px" width="590px">
    <text id="myCircle" class="important" fill="url(#myGradient)" y="17" x="0">
        <tspan></tspan>
    </text>
</svg>

Why JavaScript was involved

At the time, browser support for SVG behavior was inconsistent enough that some teams preferred to construct parts of the SVG node tree with script, including gradients and text nodes. That made the effect more portable, but also made the frontend more fragile.

Modern takeaway

The Evo-specific lesson still stands: keep the content values in the CMS, but isolate experimental rendering behavior in the theme layer. Do not let presentation hacks leak back into the content model unless they are truly reusable.

Source: Evolution CMS on GitHub.