Sightly Code in content fragment Extension

Hi Aem Experts,

I currently have an issue in using the content fragment extension. I need to put sightly code inside and it does not allow me so.

This code is in my template:

<sly data-sly-test.scheme="${request.scheme}"/>

<sly data-sly-test.servername="${request.serverName}"/>

<sly data-sly-test.serverport="${request.serverPort}"/>

<div data-sly-test.author="${wccmmode.edit||wcmmode.design}">

    <sly data-sly-test.requesturl="${scheme}://${servername}:${serverport}"/>

</div>

<div data-sly-test="${!author}">

    <sly data-sly-test.requesturl="${scheme}://${servername}"/>

</div>

This is in my content fragment and when it gets rendered using context = unsafe, it just shows this below and not the actual url. If I use context = html it does not render the whole line.

<p style="text-align: center;"><img src="${requesturl}/content/dam/tg-certificate/images/TGPlan3.jpg" alt="contact information"><br>

Please help thanks