Wix.Styles

getStyleId

Retrieves the component’s styleId. The styleId represents a set of style parameters we’ve stored for a specific component – colors, fonts, numbers, and booleans.

SDK Version: SDK 1.65.0+
Editor Version: New Editor
Display: Live Site, Preview
Components: Widget, Pinned (aka Fixed-Position) Widget, Page

Once you know the component’s styleId, you can retrieve these style parameters using getStyleParamsByStyleId.

Syntax:

Copy
Wix.Styles.getStyleId(callback)

Parameters:

NameTypeDescription
callback (required)Function A callback function that receives the styleId

Example:

Copy
Wix.Styles.getStyleId(function(styleId){ //do something with the styleId });

getStyleParams

Retrieves the style parameters of the current component: booleans, numbers, colors, and fonts.

SDK Version: SDK 1.26.0+
Editor Version: New Editor, Old Editor
Display: Live Site, Preview
Components: Widget, Pinned (aka Fixed-Position) Widget, Page

Note:
If calling this method in the settings endpoint, it returns the style parameters of the component that opened the settings endpoint.

Syntax:

Copy
Wix.Styles.getStyleParams(\[callback\])

Parameters:

NameTypeDescription
callbackFunction Callback function to retrieve the style values

Example:

Copy
Wix.Styles.getStyleParams( function(styleParams) { //do something with the style params });

Returns:

Copy
//returns an object with all of the style parameters { booleans: { showDescription: true, showTitle: true }, Colors:{ titleColor: { themeName: "color-5", value: "#302D2D" } }, fonts: { btnFont: { displayName: "Paragraph 2", editorKey: "font_8", family: "din-next-w01-light", fontStyleParam: true, preset: "Custom", Size: 15, Style: { bold: false, italic: false, underline: false, }, value: "font:normal normal normal 15px/18px din-next-w01-light, din-next-w02-light, din-next-w10-light, sans-serif;" } }, Numbers:{ Animation: 2 } }

getStyleParamsByStyleId

Retrieves the style parameters for a given styleId. The styleId represents a set of style parameters we’ve stored for a specific component – colors, fonts, numbers, and booleans.

SDK Version: SDK 1.65.0+
Editor Version: New Editor
Display: Live Site, Preview
Components: Widget, Pinned (aka Fixed-Position) Widget, Page

You can get the component’s styleId using getStyleId.

Syntax:

Copy
Wix.Styles.getStyleParamsByStyleId(styleId, onSuccess, \[onFailure\])

Parameters:

NameTypeDescription
styleId (required)StringThe component’s styleId
onSuccess (required)FunctionCallback function to retrieve the component’s style parameters
onFailureFunction Callback function to handle the case that the styleId wasn't found

Example:

Copy
Wix.Styles.getStyleParamsByStyleId( 'djk32', function(styleParams) { //do something with the styleParams }, function(){ //throw error } );
Did this help?