We are working on it! We have a lot of information that we want to cover here, so be patient with us as we continually update this article. How (Responsive)...
The Stack This is one of the most frequently used responsive action. The reason for that is simple, at small screens there is little room for content to be displayed next to each other....
Layout, Elements & Themes In this chapter we will be starting the creation of a menu. You’ll get an overview of the different visual controls and and learn to use a bunch of them....
You may be asking yourself what really is a Responsive theme and why do I need one? Well a responsive theme is a process of web design that allows a website designer to restructure a website at...
This article has been updated! Version 5.0 of CoffeeCup Image Mapper will create stunning responsive image maps which means no more having to “hack” the code to produce one! The Wizard will...
Responsive Email Designer is available in two versions: Personal and Business. RED Personal focuses on a core-set of features and options to produce a responsive email. RED for Business builds on...
This is a page in (never ending) progress... Themes, Projects, Prototypes, Links, Experiments & More: Do you love our snazzy quick start examples (thanks, you’re making us blush)...
Create Responsive Slideshows and Presentations Direct from the CoffeeCup labs is Responsive Content Slider. This app gives you the ability to combine pictures, text, buttons, icons and...
We know that you were taught that pushing and pulling were unacceptable in school, but that is only if you do it to a living being. It does not count when it is an Element in your design!...
Yep, you asked for it, we listened. Using Website Insight you can now create customized reports based on the scanned data the app finds. Within a matter of minutes, you can export a...
Responsive Navigation: relative widths and breakpoints Responsive web design is a technique used to build websites and website components (like a web form or navigation menu) that are easily...
Now that you know how Layout Maker works, let’s put your skills to the test. Here we are going to walk you through a quick process on how to build a layout. This only covers the basics, but...
Layout Maker also allows you to include additional pages, giving you the ability to fully mock up an entire website. As you add pages, they will automatically appear in your Navigation element....
Now that your layout is ready for the public, you’ll want to explore your options for putting it on the web. You can publish to S-Drive by entering your CoffeeCup account information, export...
Media queries are a powerful ingredient of Responsive Web Design (RWD) supported by all modern browsers. A media query is a small bit of CSS code that works by asking (querying) the...
Need a little more pratice? In this article we explain how to edit the HTML and CSS of the remaining pages of our project. Follow along with the instructions and your Nova theme will be up and...
Display Properties are used for controlling the way elements flow within your layout. All elements have a default display depending on what type element it is. Usually this is block or inline....
It is always helpful to have predefined classes when designing any website. That is why both Coffeegrinder and Bootstrap 2 have included a few predefined classes that can make building your...
When using Responsive Email Designer there are many different email clients that you have to take into consideration when you are designing your email. While there are many out there (hundreds),...
Layout Maker Template Pack Looking for inspiration on how to create a responsive layout? If so, then we got you covered! Here we have put together an awesome bundle of responsive layouts that...
CoffeeCup Image Mapper allows you to specify multiple links (or hotspots) to specific locations of an image and point them to a document or website. Create mouseover text, ALT text, links and...
When opening the program, you are presented with the Image Mapper Wizard, which asks whether you would like to start a new image map, or open an existing one. Image Mapper Wizard...
Design pane The design tab holds many of the editing features of the program and can assist in setting up your new image map! These tools allow you to specify different links using the right...
Ready to export your image map? When exporting, you have two choices to select from (responsive and non-responsive). To start the export process go to File > Export Image Map select the type of...
In this article, we are going to walk through how to apply a mouseover effect on an background image that will then display text in place of the image. We accomplish this by using multiple...
How we solved the IE 11 fixed background bug In our efforts to make the best possible experience with all of our themes, we attempted to fix a reported bug regarding fixed backgrounds in...
