Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Converting a website in Modx to be responsive

Featured Replies

Hi I'm currently working on a website at http://proofing.yorkcreative.co.uk

 

which I've taken from a different designer and converted to use Modx CMS (which I often use).

 

This site has already had a few others work on it before me! But I've got everything working nicely. The problem now is my client wants to keep the design and go mobile responsive. Although I explained this is messy and can't really be done without a rebuild, he doesn't want to lose all the previous work he's paid for and it's all already taken months - he wants to launch.

 

Here's the site: http://proofing.yorkcreative.co.uk

 

I've started using HTML Kickstart to work on putting all the content into a responsive framework but I'm encountering a few issues along the way such as the slider with the van moving in and straplines etc.

 

I've got the responding here:

 

http://proofing.yorkcreative.co.uk/test.html

 

Can anyone please help or advise how I can get the slider to stay how it is and animate nicely with the van driving across etc, but if I make the browser window small either hide this completely or make the animation all smaller?

 

Thanks very any help with this.

Sliders are so 2013 :)

 

You probably won't be able to do the whole slider on small screens, there's simply not enough room. I would look at CSS3 animations instead, and use a "static" fallback fro older versions of IE. If you can, try to reduce the number of animated elements, then for small screens you can disable the animation and provide a simple text message.

 

I'd also look at the document size, currently it's sitting at 3mb (uncompressed), of which 1.6mb is Javascript - that's not going to play nicely on 3G!

that's not going to play nicely on 3G!

3G is so 2013.

 

 

Sorry couldn't resist.

 

OP, there are some responsive sliders that can handle the animation for you. A quick Google search will bring the up.

Basically a "static" hero area, maybe spiced up with a bit of CSS animation. :)

 

Hmm... I'm not completely convinced. I think they're a great way to display key content in limited spaces. Especially useful for feedback, news, etc!

 

Hmm... I'm not completely convinced. I think they're a great way to display key content in limited spaces. Especially useful for feedback, news, etc!

Go on then throw an idea into the pot :)

Go on then throw an idea into the pot :)

 

I've no idea - you suggested that sliders were effectively redundant (or 'out of fashion') :p

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.