Search.../

SDK

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:

Wix.Styles.getStyleId(callback)
JavaScript | Copy Code

Parameters:

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

Example:

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

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:

Wix.Styles.getStyleParams(\[callback\])
JavaScript | Copy Code

Parameters:

NameTypeDescription
callbackFunction Callback function to retrieve the style values

Example:

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

Returns:

//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
}
}
JSON | Copy Code

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:

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

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:

Wix.Styles.getStyleParamsByStyleId(
'djk32',
function(styleParams) { //do something with the styleParams },
function(){ //throw error }
);
JavaScript | Copy Code

Was this helpful?