# Style scripting in Ignition Perspective

**URL:** <https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [May 8, 2024, 10:17am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086 "2024-05-08T10:17:18Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 8, 2024, 10:17am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/1 "2024-05-08T10:17:19Z")

</div>

I have notice in a post some scripting in this forum like this:

- `column.n.header.align : top`
- `column.n.header.style.backgroundRepeat : no-repeat`
- `column.n.header.style.backgroundImage : url("/system/images/Builtin/icons/48/logic_and.png")`
- `column.n.header.style.height : 60px` ← Set this to image + text height.
- `column.n.header.style.backgroundPosition : bottom`

I wonder if is possible to add styles by script directly or should to do it by hand on the interface:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/d/ada3f7d2f7a19a8d49f6f44839cb3923605e7a8a.png)

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [May 8, 2024, 10:40am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/2 "2024-05-08T10:40:09Z")

</div>

Those aren't scripting. They are Perspective property settings.

You can edit and create (if they are valid) property settings by script. For example:  
`self.getSibling("Label_1").props.style.backgroundColor = "red"`

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 8, 2024, 10:42am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/3 "2024-05-08T10:42:41Z")

</div>

Where can I add the property settings?

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [May 8, 2024, 10:54am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/4 "2024-05-08T10:54:13Z")

</div>

You would have to add a button, write the script, run Preview in Designer, click the button, exit Preview, delete the button and save.

Or you could just create them normally for less work.

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 8, 2024, 11:03am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/5 "2024-05-08T11:03:22Z")

</div>

I don´t know how to add those written settings into my props.

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [May 8, 2024, 11:22am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/6 "2024-05-08T11:22:16Z")

</div>

Then why did you mark post #2 as "Solution". I think you also marked the post where I gave those settings as solved as well?

* * *

Example: add `column.n.header.style.backgroundRepeat : no-repeat` to column 0:

![Property creation](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/c/3c14a6ba07563d3afd8605bd41533ab90671e46c.gif)

Go to the section where you want to create the property.

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 8, 2024, 11:24am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/7 "2024-05-08T11:24:14Z")

</div>

Yes, this I know how to do, what I don´t know is add the:

You can edit and create (if they are valid) property settings by script. For example:  
`self.getSibling("Label_1").props.style.backgroundColor = "red"`

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [May 8, 2024, 11:40am UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/8 "2024-05-08T11:40:53Z")

</div>

- Create a view.
- Add a label and a button.
- On the button add  
`backgroundColor : <anything>`
- On the button add an onActionPerformed event script.
- Add the following code.

```python
def runAction(self, event):
	if self.getSibling("Label").props.style.backgroundColor == "blue":
		self.getSibling("Label").props.style.backgroundColor = "grey"
	else:
		self.getSibling("Label").props.style.backgroundColor = "blue"

```

- Switch on Preview mode and test.

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 8, 2024, 12:04pm UTC](https://forum.inductiveautomation.com/t/style-scripting-in-ignition-perspective/90086/9 "2024-05-08T12:04:31Z")

</div>

Thanks a lot Transistor.