Create a simple pulldownmenu & mobil navigation inside the RSD with a few lines of extra code.

Link to the video https://youtu.be/VSKfcqFbbTM

Link to the tutorial page http://realdesign4you.com/tutorials/deep-link
To download the rsd file click the download link on the tutorial page in the nav menu.

Building Accordion With RSD and jQuery

https://www.youtube.com/watch?v=RTC0BD_quWU

Building Basic jQuery UI Tab with Responsive Site Designer

https://www.youtube.com/watch?v=cOLbJNO7gMs

Make OS Color Picker Available on Your Screen

https://www.youtube.com/watch?v=ovaUMiSVISQ

Enjoy it.

Hey everyone!
There is new tutorial available that describes how to use the cool <Picture> element. Check it out at: http://www.coffeecup.com/help/articles/1431

Overlay a background-image with a background-color

https://www.youtube.com/watch?v=Hpu1PVQ_yRY

Mouse hover and transition plus scale effect on button

https://www.youtube.com/watch?v=xa1xToV5miY

Adding Hyperlink To Text With Responsive Site Designer

https://www.youtube.com/watch?v=fhukBFCni5Q

Responsive Video in RSD Hack

I was responding to someones post on how to make video responsive in RSD and came up with this hack, I figured it would be nice to share it to all...

I've attached 2 screenshots for reference...

Step 1. You will need to download this framework here, uncheck everything except for flex video ( http://foundation.zurb.com/develop/download.html )

Step 2. Save the download folder in your RSD project

Step 3. Open your RSD project and go to the Elements Panel

Step 4. Drag an HTML Element where you want the video to display

Step 5. Select the HTML Element and paste your Youtube/Vimeo video code - I'll attach screenshots just incase - Important - Give your HTML element this class name - copy and paste it, without the brackets ( flex-video widescreen vimeo )

Step 6. In the Settings Panel, Add resources in the Head Section - Click Add Resources and navigate to the folder containing the framework you downloaded and select from the CSS folder ( foundation.min.css )

Step 7. Repeat step 6 - this time select from the JS folder and ( foundation.min.js )

Step 8. Still in the Settings Panel, paste this script in the Footer Section ( <script>
$(document).foundation();
</script> )

Step 9. Preview and resize your browser to see this work

Step 10. If you run into any snags, let me know...

Hope this helps you and anyone that might want to use this hack... Cheers!

Exporting Coffeecup Menu Builder & Importing into Site Designer

https://www.youtube.com/watch?v=lGr7yocOWMQ