Set Button Vertical Text Display

1.1 Expected Effect

In the report, after adding a button, you can modify the button name. Generally, button names are displayed horizontally. If you need to display vertically, how to achieve it? As shown below:

1.2 Implementation

In addition to designing the button image style first and adding the image implementation method to the initial background of the button, it can also be implemented by adding JS.

2.1 Prepare Template

Create a new template, add a "button widget" to the parameter pane, and adjust the button shape. As shown below:

2.2 Add Event

Add a "After Initialization" event to the button widget, define the button name and display mode in the event. As shown below:

JavaScript code

Note: If the widget name of the custom button is pb_c, then it should be written as: fr_btn_PB_C

setTimeout(function(){
	$("#fr-btn-BUTTON0").html('Frist'+'<br>'+'Second')
	},100);

2.3 Effect Preview

Save the template, click "Pagination Preview", the effect is as shown in the figure below:

Click to download template:

Set_button_vertical_text_display.cpt