{"id":14631,"date":"2015-09-29T13:09:51","date_gmt":"2015-09-29T12:09:51","guid":{"rendered":"https:\/\/help.instantatlas.com\/dashboard-builder-desktop\/desktop-user-guide\/the-instantatlas-designer\/creating-a-new-design\/button\/image-properties\/"},"modified":"2020-11-25T11:32:59","modified_gmt":"2020-11-25T11:32:59","slug":"image-properties","status":"publish","type":"page","link":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/en\/welcome\/desktop-user-guide\/the-instantatlas-designer\/creating-a-new-design\/button\/image-properties\/","title":{"rendered":"Image"},"content":{"rendered":"

If you select or insert an image component into the Designer canvas, the \u2018Image Properties\u2019 will appear in the properties pane.<\/p>\n

\"\"<\/a><\/p>\n

This dialog features a \u2018Reset Size\u2019 button and \u2018Copy to Output\u2019 checkbox. Click the \u2018Reset Size\u2019 button to set the width and height values to the width and height in pixels of the original image. Click the \u2018Copy to Output\u2019 checkbox if you wish the image you are inserting to be copied into the report folder. You should do this if you intend to move the report folder at a later stage.<\/p>\n

If the \u2018Auto-size?\u2019 option is ticked, the image will rescale together with the browser window. With images, however, this may cause a loss of quality. If you would like to keep the image in its set size you should disable the auto-size option.<\/span><\/p>\n

There is a padlock icon next to the ‘Width’ and ‘Height’ settings that can be opened and closed by clicking on it.<\/p>\n

Closing the padlock has two results:<\/p>\n

    \n
  1. Changing the width of an image will automatically adjust the height of it according to the image\u2019s aspect ratio and vice versa.<\/li>\n
  2. If the \u2018Auto-size\u2019 check box is ticked, the image will keep its aspect ratio in the dynamic report while still resizing when the browser window size changes.<\/li>\n<\/ol>\n

    Most images such as logos will benefit from having the padlock icon closed, however if you do not wish for the aspect ratio of the image to be preserved (e.g. for banners) you can simply open the padlock icon to stretch the image to the desired dimensions.<\/p>\n

    Using \u2018Anchor Left\u2019, \u2018Anchor Middle\u2019 and \u2018Anchor Right\u2019, you can define where the image is anchored in the report. For example, if you want your image to be positioned on the right hand border and unaffected by the browser window size, you would choose the \u2018Anchor Right\u2019 option.<\/p>\n

    To move the image around you can either use the X and Y fields in the \u2018Properties\u2019 tab or you can click the image in the canvas to select it and drag it to the desired location. If necessary, you can resize it by dragging the selection handles.<\/p>\n","protected":false},"excerpt":{"rendered":"

    If you select or insert an image component into the Designer canvas, the \u2018Image Properties\u2019 will appear in the properties pane. This dialog features a \u2018Reset Size\u2019 button and \u2018Copy to Output\u2019 checkbox. Click the \u2018Reset Size\u2019 button to set the width and height values to the width and height in pixels of the original … Continue reading Image<\/span><\/a><\/p>\n","protected":false},"author":22,"featured_media":0,"parent":14471,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-14631","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/pages\/14631","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/users\/22"}],"replies":[{"embeddable":true,"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/comments?post=14631"}],"version-history":[{"count":0,"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/pages\/14631\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/pages\/14471"}],"wp:attachment":[{"href":"https:\/\/help.instantatlas.com\/instantatlas-desktop\/wp-json\/wp\/v2\/media?parent=14631"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}