HI, I would like to use the morphing outline to create a button but I only find the field to insert the text without having the possibility to vary its size. Furthermore, I can change the color and thickness of the border, but not the distance from the text and therefore the result is a very large button even if the text is made up of 2 characters. Where can I set these parameters? Thank you, Emanuela
Once the code is added, save and refresh the page to see if the change has been applied. In case it helps, please check this section from the documentation on CSS/Script Related.
If this does not work as expected or If you have any further questions or need additional assistance, don't hesitate to write back, I'm happy to help.
HI,
I would like to use the morphing outline to create a button but I only find the field to insert the text without having the possibility to vary its size. Furthermore, I can change the color and thickness of the border, but not the distance from the text and therefore the result is a very large button even if the text is made up of 2 characters.
Where can I set these parameters?
Thank you,
Emanuela
Attached files: Screenshot Morphing setting.png
Hi again,
Thank you for getting in touch.
Could you please share a screenshot of what you'd want this to look like so we can check out and advise?
We look forward to your feedback.
Cheers,
Here is a picture of the size it should have and how it looks now
Attached files: Morphing.png
Hello Ksdata,
Thanks for writing back.
To make the changes as requested, you will need to add some custom CSS code. To do this, please follow these steps:
From your WordPress dashboard, Navigate to Salient > General Settings > CSS/Script Related. In the custom code area, insert the provided CSS snippet:
body .wpb_column > .wpb_wrapper > .morphing-outline.instance-0 .inner:after, body .wpb_column > .vc_column-inner > .wpb_wrapper > .morphing-outline.instance-0 .inner:after { top: -1em; margin-left: 1em; } body .wpb_column > .wpb_wrapper > .morphing-outline.instance-0 .inner:after, body .wpb_column > .vc_column-inner > .wpb_wrapper > .morphing-outline.instance-0 .inner:after { padding: 20.8672px 26px; }Once the code is added, save and refresh the page to see if the change has been applied. In case it helps, please check this section from the documentation on CSS/Script Related.
If this does not work as expected or If you have any further questions or need additional assistance, don't hesitate to write back, I'm happy to help.