Responsive Site Designer Tips and...

User 2744602 Photo

Registered User
162 posts

Add Responsive Video and Maps etc.
Hey guys found this is RLM forum its Brilliant for Video and maps etc.

paintbrush wrote:
I've used this with good results:
It will generate embed code for other things as well, like Google maps.;)
KISS is the key!
User 399746 Photo

Sales & Support Manager
409 posts

For all you visual learners out there we have something cool to announce. A new tutorial has been posted that breaks down the creation of a responsive page in just 5 steps. This article is unique as it includes 8 instructional videos. Check it out at:

We'd love to hear any feedback you may have!

Enjoy! :)
Learn the essentials with these tips on Site Designer. You'll be making epic, code-free responsive sites like a boss.
User 434929 Photo

938 posts

Jamie wrote:
Hey Guys
Have set up a ul link section - kept it in the vertical - styled it etc but what I am struggling to do is to get the whole line be a clickable link rather than just the text that is being used

Creating a Navigation Menu using an Unordered List
Guys at coffeecup are awesometacular.
User 434929 Photo

938 posts

Tutorial: Horizontal And Vertical Centering In Responsive Site Designer
Guys at coffeecup are awesometacular.
User 434929 Photo

938 posts

Adding Fixed Background Attachment
Guys at coffeecup are awesometacular.
User 2823310 Photo

Registered User
312 posts

My original post is here: … post258503

In settings add this script to the footer:

$('a[href^="#"]').on('click', function(event) {
var target = $( $(this).attr('href') );
if( target.length ) {
$('html, body').animate({
scrollTop: target.offset().top
}, 4000);


You can change the speed with 4000 in the script.
6000 would be slower, 1000 faster for example.

Let's use a text named anchor (bookmark) to an image.
You could also use an image or icon and add a link
So put a text object at the top of the page and add a link to it using a named anchor hash like this for the FROM link.
In href paste:

With some space between (so you have some page to scroll to see it work) at the bottom add an image for the TO link.
Now select that image and put this in for it's ID

Preview it in your browser to see it work.

What that script is doing is looking for any named anchor on the page and making it animate the page scroll to the ID. So if you wanted to add more just match the #anchor to the ID (which would be "anchor" in this case).

That's assuming there is a jQuery library link, I read here yesterday that may be taken out in recent releases?
If it is removed on your version just add this link to the google jQuery library with this call above the script in the footer:
<script src=""></script>
User 434929 Photo

938 posts

Building Basic jQuery UI Tab with Responsive Site Designer v1.5

project files: …
Guys at coffeecup are awesometacular.
User 2088758 Photo

Senior Advisor
3,024 posts

Great Video Mansour!

Yea I'm a little disappointed they took out js too. That being said I understand why they did.
Taking over the world one website at a time!

Steve Kolish

YouTube Channel: … ttneYaMSJA
User 283347 Photo

Registered User
388 posts

Yes, thank you Mansour. I've been doing it the hard way :) or not having success at all so these were very helpful.

User 113083 Photo

251 posts

Mansour ... wrote:
Exporting Coffeecup Menu Builder & Importing into Site Designer

Thank's Mansour for a great video. :)

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.