Responsive Site Designer Tips and...

User 2407752 Photo


Registered User
44 posts

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.
Only dead fish go with the flow!

I work with: RSD - RLMP - WFB - MB - WE 2.0
http://www.realdesign4you.com
User 434929 Photo


Ambassador
937 posts

Building Accordion With RSD and jQuery

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

Guys at coffeecup are awesometacular.
User 434929 Photo


Ambassador
937 posts

Building Basic jQuery UI Tab with Responsive Site Designer

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

Guys at coffeecup are awesometacular.
User 434929 Photo


Ambassador
937 posts

Make OS Color Picker Available on Your Screen

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

Enjoy it.

Guys at coffeecup are awesometacular.
User 399746 Photo


Sales & Support Manager
122 posts
Online Now

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
Learn the essentials with these tips on Site Designer V3. You'll be making awesome, code-free responsive sites like a boss.
User 434929 Photo


Ambassador
937 posts

Overlay a background-image with a background-color

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

Guys at coffeecup are awesometacular.
User 434929 Photo


Ambassador
937 posts

Mouse hover and transition plus scale effect on button

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

Guys at coffeecup are awesometacular.
User 434929 Photo


Ambassador
937 posts

Adding Hyperlink To Text With Responsive Site Designer

https://www.youtube.com/watch?v=fhukBFCni5Q
Guys at coffeecup are awesometacular.
User 2756496 Photo


Registered User
44 posts

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! :)
Attachments:
Kelvin
ON2 Interactive - ON2 Themes
www.on2interactive.com
User 434929 Photo


Ambassador
937 posts

Exporting Coffeecup Menu Builder & Importing into Site Designer

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

Guys at coffeecup are awesometacular.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.