Responsive web design in Kentico 9.0.1

Hannah Harvey asked on July 9, 2019 14:01

Hi,

I want to insert a hero image in a page so that it:

  • Either shrinks with width device so that users on tablets and mobiles (for example) see the same image as desktop users but just smaller.
  • Or changes according to device width

I basically want the image to look 'complete' for all users.

I am using Kentico 9.0.1. I am a content editor and have access to the Page and Design tab but not much more.

If there is a way for me to do it by myself then that is my ideal solution. If that's not possible, but there is a way for a developer to do it, then I would be interested in knowing how.

Thanks

Correct Answer

Brenden Kehren answered on July 9, 2019 14:11

Hanna,

This is typically something done at the CSS level and or JavaScript level by a front end developer.

Secondly, if your side isn't currently setup to be responsive meaning your content doesn't change "shape" for different viewports, this will need to happen as well. Again, something typically a front end developer usually does.

Typically setting the img width property to 100% will adjust the image but may cause a lot of problems I'd the rest isn't implemented. If you need assistance, look me up, we can help out.

0 votesVote for this answer Unmark Correct answer

Recent Answers


Hannah Harvey answered on July 9, 2019 16:31 (last edited on July 9, 2019 16:35)

Brendan,

Thanks for your quick response. Setting the image width property to 100% seems to have done it - just had to find out where to do it!

Thanks so much for your help.

0 votesVote for this answer Mark as a Correct answer

Brenden Kehren answered on July 9, 2019 16:33

If you're using that webpart/widget, you won't be able to set a percentage. This will need to be taken care of within the CSS then.

0 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.