Can I not change the styling of vector shapes???? 😡

Ask the community
,
1

In Editor X, I have set a Vector Shape to trigger a Lightbox Menu. It sits in the header. When someone scrolls down the page, I want the vector shape to change colour. By looking at the Velo API I cannot find a way to change the styling colour of the vector shape.

Same thing with text. According to the API, I cannot change the colour styling of a ‘Text’ element. (I cannot add a ‘TextBox’ element in Editor X - its called a ‘Text’ element in Editor X) https://www.wix.com/velo/reference/$w/text/type
The only way to format the text is using https://www.wix.com/velo/reference/$w/text/introduction#$w_text_introduction_formatting-text this code. However when I use this code, it messes up the styling of the text I customized using the Editor. Then I have to recode the styling. Why can’t Wix make it easy to customize the styling of text and vector shapes like how easy it is for Buttons.

Smh Wix makes it so hard to do simple things. :rage: One issue after the next.

2

Perhaps you could do it somehow with an iFrame / HTML-Component…

<!DOCTYPE html>
<html>
  
<head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" 
 content="IE=edge">
  
 <meta name="viewport" content=
 "width=device-width, initial-scale=1">
  
 <title>
 How to change SVG color?
 </title>
</head>
  
<body style="text-align: center;">
  
 <h1 style="color: green;">
 GeeksforGeeks
 </h1>
  
 <div>
 <svg height="1000" width="500">
 <circle cx="250" cy="120" r="80"
 stroke="#000" stroke-width="5" 
 style="fill:#060">
 </svg>
 </div>
</body>
  
</html>

Put an HTML-component / iFrame onto your site-page.
Put the shown code into the new generated element and save it.

You should now get something like…


These two variables are important, which changes the “fill-color” and the “border-color”…

stroke="#000" stroke-width="5"  // border-color
 style="fill:#060">             // fill-color

Change MANUALLY the color-value for each of the given variables and see what happens.

You could also do the same thing by using the post-message to interact between HTML-Component and your wix-page.

It is just an example, found here…

Now try to add 1+1 to get —> 2 <— 2=will be your end-result. :wink:

3

@russian-dima yes this will work, but the point is, Wix makes it harder to achieve something so simple. I don’t get why it isn’t built into the API so we can change the colour of the vector shape with one line of code. Now I have to hack it using an iframe and all sorts. Just how the API allows me to change the text or colour of a button in a simple fashion, the same should be for vector shapes and text elements. This is such a SIMPLE task and Velo makes it soooo much harder. Wish we had access to the CSS Stylehsheet or html like webflow allows. it would make it so much easier to customize this type of stuff. Instead I have to hack it with Javascript on Velo lol.

4

@wfclote
Your wish would come truth faster, if you would vote for the CSS-Feature on the Wix-Wishlist.

Take a look here…
https://www.wix.com/velo/requested-feature/css-feature

You will also find other wishes on the wishlist.

If everybody who has a wish would also vote in the wishlist, i am sure, there would be also much more new features on wix.

5

@russian-dima Just voted! Don’t even know these Wishlist’s exist.