To Design the screen with the responsive screen

By | April 22, 2021

In latest version of the Sage X3 Patch 23, we have new feature of designing in the using the badge as shown below.

On every screen we have drop-down as shown below:

Fig : Screen with badge option

This will display the below page as below, this will hold the panel with the sections, block and the fields:

Fig: Badge screen

From this screen, we will be able to change the locations of the screens with the below steps:

On the left panel you will able to see each and every screen, blocks and the fields according to that we would be able to the change the dimensions.


Initially we will start with the screen, where we have two different options to arrange the objects within the tabs and screen with the columns and stacked.

Column: In the column options, all the fields in that particular screen will be arranged in the column manner which are mentioned in the decimal as shown below.

Columns flag is “ON”, this would arrange the blocks in the below shown format.

Fig: Column format

If the column flag is “OFF”, the arrangement can be done in the below format. Where the Block in the screen will be displayed one after the other.

Fig: Column off

We have another option of the Stacked which have some different arrangement of the fields, in this option the field which are present in same line will align one below the other. On the one click all the fields which are having same line number will be brought one below the other.

As per below screenshot the arrangement of field is done on one below the other as shown below.

Fig: Stacked

In case of the stacked in turn off it would bring the field as per mention in the screen master.

Fig: Non stacked

The same set of the Stacked and Column can also be implemented in the block level as shown below.

Fig: Stacked

In this setup, we can implement column or Stacked entirely on the screen that is all the blocks mentioned in the screen will hold in the manner as mentioned in the screen. Hence there is no need to go on each block and apply this setup it would be implemented to all the blocks present in the screen.

In case if we need specific block to behave in different manner then the screen setup then we can make the flag change to arrange the objects in that manner.

Display mode:

There are two more option where we can hide the fields from screens using the badge as shown below.

We have option of hiding the field from the desktop mode and display in mobile mode. Or we have another option to hide from mobile mode and display in the Desktop mode.

Fig: Options

We can hide from the both mode, desktop and mobile.

We have one more option to declare any field as last line on the screen. Hence if we click on the below option then all the remaining field would be shifted to next line.

Fig: Options

The above process will help us to make the movement of field , hide and display of field as per the UI needed.

About Us

Greytrix – a globally recognized and one of the oldest Sage Development Partner is a one-stop solution provider for Sage ERP and Sage CRM organizational needs. Being acknowledged and rewarded for multi-man years of experience, we bring complete end-to-end assistance for your technical consultations, product customizations, data migration, system integrations, third-party add-on development and implementation competence. 

Greytrix caters to a wide range of Sage X3, a Sage Business Cloud Solution, offerings. Our unique GUMU™ integrations include Sage X3 for Sage, Dynamics 365 CRM and Magento eCommerce along with Implementation and Technical Support worldwide for Sage X3. Currently we are Sage X3 Implementation Partner in East Africa, Middle East, Australia, Asia, US, UK. We also offer best-in-class Sage X3 customization and development services, integrated applications such as POS | WMS | Payment Gateway | Shipping System | Business Intelligence | eCommerce and have developed add-ons such as Catch – Weight  and Letter of Credit and India Legislation for Sage X3 to Sage business partners, end users and Sage PSG worldwide. Greytrix Sales Commission App for Sage X3 simplifies commission calculations and postings on sales transactions.

The GUMU™ Cloud framework by Greytrix forms the backbone of cloud integrations that are managed in real-time for processing and execution of application programs at the click of a button.

Greytrix is a recognized Sage champion ISV Partner for GUMU™ Sage X3 – Sage CRM integration also listed on Sage Marketplace; GUMU™ integration for Sage X3 – Salesforce is a 5-star rated app listed on Salesforce AppExchange and GUMU™ integration for Dynamics 365 CRM – Sage ERP listed on Microsoft AppSource.

For more information on Sage X3 Integration and Services, please contact us at, We would like to hear from you.