How do I upgrade a fluid grid template created in CS6 to CC?

Do I need to recreate the template from scratch to take advantage of the CC improvements? Is there a tool for simply upgrading it?
Thanks

The following FGLayout was built by me in CS6. It performs as expected in IE10.
http://alt-web.com/FluidGrid/Fluid1.html
If your FGLayout isn't rendering right in IE10, I can 100% guarantee you that it's caused by web designer error or bad coding practices. And CC won't help you with either of these things.
Nancy O.

Similar Messages

How to make regions editable in fluid grid template in 2014.1.1 in LIVE view - can't open the template editable selection panel

I am teaching a course in Dreamweaver 2014.1.1
We are setting up templates in fluid grids.
We need to make regions editable.
The LIVE view replaced the DESIGN view and does not have certain options accessible anymore.
I can't find the command to access the dropdown panel to make a region editable.
The Template tab at top, and the make editable options subtab, will not come open in fluid grid template mode.
Does anyone have a way to do this?

I was under the impression that the February update (2014.1.1) released a few days ago had fixed these problems. I urge you to file an official bug report below.
https://www.adobe.com/cfusion/mmform/index.cfm?name=wishform
My advice for now is to stay away from Fluid Grid Layouts. But if that's not an option, I'll show you a trick for getting Design View back. Open the Fluid Grid CSS file and add an X as shown below. This tricks DW into thinking it's a normal layout.
    Dreamweaver Fluid Grid Properties
    dw-num-cols-mobile:      X 4;
    dw-num-cols-tablet:        8;
    dw-num-cols-desktop:    12;
    dw-gutter-percentage:    25;
=====================================
Once saved, you should see Design View as an option.
Nancy O.

Fluid grid template - editable region - resize not possible

Hi,
After quitting DW the first resizing problem was gone.
Now I saved the page as a template and inserted an editable region.
Then it wasn't possible anymore to recize the divs.
The lines are know yellow dotted.
Do I have to make editable regions in a different way?
See: http://www.ifacilityservices.nl/index.html
Thanks again.
Carla

Hi Nancy,
Thanks voor your reply!
Is it now not possible anymore?
I deleted the editable regions, but it stays with the yellow lines.
Carla
Van: Nancy O. [email protected]
Verzonden: zaterdag 24 augustus 2013 21:59
Aan: Carla Leliveld
Onderwerp: fluid grid template - editable region - resize not possible
Re: fluid grid template - editable region - resize not possible
created by Nancy O. <http://forums.adobe.com/people/Nancy+O.> in Dreamweaver CC - View the full discussion <http://forums.adobe.com/message/5623512#5623512

How do I turn off fluid grid layout guides in CC?

In CS6 it was simple: just go to View > Visual Aids and uncheck "Fluid grid layout guides" In CC that option is not there. And I can't seem to find it. So how do I turn off fluid grid layout guides in CC?

AFAIK, There is no option for you to turn off just FG Layout Guides in DW CC (for now).
However, you can hide the guides with just 1 click. See screenshot below:
This button toggles FG View. Disabling it will hide the FG guides that you see on screen.

Creating Adaptive Designs Using Fluid Grid Layouts in Dreamweaver CS6 | Digital Design CS6 | Adobe TV

Adobe Evangelist Greg Rewis shows how to create adaptive designs using Fluid Grid Layouts in Dreamweaver CS6.
http://adobe.ly/Iq7L8z

maybe someone here can answer this. Can I take an existing website and apply the fluid grid layout feature to it? I have one regular website that is not responsive. I've tried copying and pasting into the dreamweaver grid layout, but it doesn't respond as expected. Is this even possible?

Using Fluid Grid layouts | Digital Design CS6 | Adobe TV

Designing for multiple screens can be a difficult and time-consuming task. The new Fluid Grid feature in Dreamweaver CS6 gives designers a visual way to control page layout for multiple screen sizes. It also automatically integrates cross-browser consistency through the use of HTML5 boilerplate and the respond.js library.
http://adobe.ly/SgbtoZ

Is there any written help on this subject because the cost of downloading these videos is too great. If I view them all it will cost me £5 a month extra in bandwidth charges as a minimum just to view help videos. Far too expensive for a charitable trust.

Using Fluid Grid layouts | Learn Dreamweaver CS6 | Adobe TV

Designing for multiple screens can be a difficult and time-consuming task. The new Fluid Grid feature in Dreamweaver CS6 gives designers a visual way to control page layout for multiple screen sizes. It also automatically integrates cross-browser consistency through the use of HTML5 boilerplate and the respond.js library.
http://adobe.ly/IUFngo

Although the whole fluid grid layout feature suffers from a terrible implementation, this video explains what is needed to understand, and warns very well for all the strange culprits in this feature.
It takes time for most designers to get used to the idea of fluidity in a visual representation of information, and let structural building blocks flow according to alternating views and rules. Let's hope Adobe Edge Reflow helps us doing that in a better, faster way.

Fluid Grid Templates

Hey all,
I'm looking to rebuild my company's current website and I'd like to use Fluid Grid Layouts to make it more appealing to my customers. My concern is that I've noticed their doesn't seem to be a way to be able to use this feature with the Templates feature.
I very much like the templates feature as I'd like knowing I can make a change to the content of the website and have it cascade across every other page (such as changing the navigation menu, adding a new image or link that I want to show up on every page, etc..) very quickly rather than having to go to each individual page one by one making the changes.
My question is: Is there a way to make these two items work or is there a better, newer way of doing this now in which I can still make use of the Fluid Grid Feature?

This sounds a bit "off" to me, I don't use DWCS6, but you should be able to turn any page made with DW into a site template.
Do you have a Defined Site set up?
What happens when you open a new fluid grid page, add a few of the basics then choose File > Save as Template?

Creating fluid grid templates

I have a very large website for a real estate company that I sold as a RWD. They have 175 or so pages of listings.
I have a good handle on DW's fluid grid design tools. When a try to create a DIV inside an editable region the DIV loses it's fluent grid functionality like copy, hide, sizing etc.
Has anyone worked with templates and DW's fluid grid. Is there a way around this problem. Any help or suggestions would be appreciated.
Thanks

I set up a really simple site to demonstrate the issue.
This is an Editable Region with a fluid grid DIV inside the region. The highlighted DIV is a regular DIV.
This next screen shot is a fluid grid DIV outside of the Editable Region. It is performing as it should.
It would make our lives much simpler if we could use the Fluid Grid DIVs in a template for the 175 redundant pages of this site.

How do I get my Fluid Grid Layout page to resizes from portrait to landscape for iPhones?

Starting in portrait on my iPhone 4, the fluid grid layout page does not resize when I turn to landscape. After I refresh / resize to fit the page on landscape and then turn the iPhone to portrait, the page resizes just fine. Everything seems to be working just fine on the desktop, ignoring IE. Could it be my media query tags?
If anyone knows a solution, it would be much appreciated. Thanks.
Here is my test page: http://www.bedroomandmore.com/1_b_fluidGrid.html
Here are my media query tags (the first set of rules does not have the media query tag and becomes the default):
@media only screen and (max-device-width: 480px) and (orientation : landscape) {
@media only screen and (min-width: 481px) {
@media only screen and (min-width: 769px) {
Here is most of my media query CSS:
@charset "UTF-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/
img, object, embed, video {
          max-width: 100%;
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
          width:100%;
/* Mobile Layout: 480px and below.(smartphone portrait) */
.gridContainer {
          width: 95.4184%;
          padding-left: 0.5907%;
          padding-right: 0.5907%;
#header {
          clear: both;
          float: left;
          display: block;
          margin-left: 0%;
          width: 72%;
          max-height: 0%;
          display: -moz-box; /* Firefox */
          display: -webkit-box; /* Safari and Chrome */
          display: box;
          border: none;
          top: auto;
          padding-top: 0.25em;
#menuHorizontal {
          clear: both;
          float: left;
          width: 118%;
          height:100%;
          margin-left: auto;
          position:relative;
          top:-1em;
          display: block;
#slides {
          clear: both;
          float: left;
          margin-left: 0.1em;
          width: 119%;
          position: relative;
          top: -1em;
          display: block;
                    /*Slides container: Important: Use position:relative; with top:-1em; together to position div.
                              Set the width of your slides container
                              Set to    display: none     to prevent content flash*/
.slides_container {
          clear: both;
          width: 100%;
          display: block;
                    /*Each slide: Important:
                              Set the width of your slides
                              If height not specified height will be set by the slide content
                              Set to     display: block     for original setting
                              slide_container is container size
                              slides_container div set the size of the image inside--adjust to fit image in it so it is not cropped*/
.slides_container div {
          clear: both;
          width: 69%;
          display: block;
          /* Mobile Layout: 480px. (smartphone landscape)
                              Inherits styles from Mobile Layout 480px.
                              Set to clear:none; to allow div to shift up
                              Or set to clear:both; to take a whole row of the screen*/
@media only screen and (max-device-width: 480px) and (orientation : landscape) {
.gridContainer {
          width: 95.4184%;
          padding-left: 0.7907%;
          padding-right: 0.7907%;
#header {
          clear:both;
          float: left;
          display: block;
          margin-left: auto;
          width:100%;
          display: -moz-box; /* Firefox */
          display: -webkit-box; /* Safari and Chrome */
          display: box;
          border: none;
#menuHorizontal {
          clear:both;
          float: left;
          width: 110%;
          margin-left:auto;
          display: block;
#slides {
          clear:both;
          float: left;
          margin-left: 0%;
          width: 68%;
          display: block;
                    /*Slides container: Important:
                              Set the width of your slides container
                              Set to    display: none     to prevent content flash*/
.slides_container {
          clear:both;
          float: left;
          width: 100%;
          display: block;
                    /*Each slide: Important:
                              Set the width of your slides
                              If height not specified height will be set by the slide content
                              Set to     display: block     for original setting*/
.slides_container div {
          clear:both;
          width:69%;
          display: block;
                    /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout.
                              Set to clear:none; to allow div to shift up
                              Or set to clear:both; to take a whole row of the screen*/
@media only screen and (min-width: 481px) {
.gridContainer {
          width: 95.9456%;
          padding-left: 0.5271%;
          padding-right: 0.5271%;
#header {
          clear:both;
          float: left;
          display: block;
          margin-left: auto;
          width: 100%;
          display: -moz-box; /* Firefox */
          display: -webkit-box; /* Safari and Chrome */
          display: box;
          border: none;
#menuHorizontal {
          clear:both;
          float: left;
          margin-left:auto;
          display: block;
#slides {
          clear:both;
          float: left;
          margin-left: 0%;
          width: 70%;
          display: block;
                    /*Slides container: Important:
                              Set the width of your slides container
                              Set to    display: none     to prevent content flash*/
.slides_container {
          clear:both;
          float: left;
          width: 100%;
          display: block;
                    /*Each slide: Important:
                              Set the width of your slides
                              If height not specified height will be set by the slide content
                              Set to     display: block     for original setting*/
.slides_container div {
          width: 100%;
          display: block;

I found the problem. There is a bug in Safari for iPhone 4. Use code to fix found at http://stackoverflow.com/a/6379407

How to edit fluid grid layout in Dreamweaver CS6

Hi all
I am a designer at the company I work for and we've been building repsonsive designs for the past 12months. I've decided that it would be good for me to try out the new fluid grid layout tool in Dreamweaver CS6 to see if we can improve the design process by using dreamweaver to allow us to quickly prototype my designs for mobile, tablet and desktop.
However I have 2 problems so far.
1) I've created my first fluid grid layout and saved all the files into a new folder. I set grid widths and gutter but now want to edit the values as I am not happy with the gutter. Can this be done? I can't seem to find the file that does this so can anyone point me in the right direction?
2) We have traditionally used pixels to define our grids. I normally produce a grid with a fixed pixel gutter, overall width and column size. It seems that Dreamweaver only has the option to use percentages. Can anyone tell me if this can be changed and again where I can do this?
Thanks for your help
Trevor

In Code View, open your FluidGrid.css file (or whatever you named it) when you created the layout.
FluidGrid Layouts are not perfect and the interface could use a lot of improvement. That said, I think they can be used as a starting point for simple layout projects providing you understand their limitations and are willing to manually tweak the FluidGrid.css code.
If you've been doing Responsive Layouts for 12 months, you're probably building desktop to mobile whereas FluidGrids build from mobile to desktop. It takes a little adjustment in thinking.
Keep FluidGrid.css for layout only. Use a seperate stylesheet for your content styles.
Nancy O.

How to make your movie from a template in AE CS6?

Hello,
Firstly, I'm new to this forum and Adobe After Effects. Hence, please excuse my beginner's language.
I recently modified a slideshow template in AE CS6. After doing all the necessary modifications in the template project, I do not know how to make a movie out of it.
I'll appreciate your help in guiding me by providing the necessary information to create the movie.
Waiting for a reply.
Thanks

JMichael wrote:
Actually, I have to create the movie urgently and send it to a colleague.
Ouch. That's rather like saying your thesis committee needs your paper tomorrow and, say, while we're at it, can we help you with your research?
After Effects is huge, unbelievably deep and stupidly complicated.
It's not that we don't WANT to help you, it's that we cannot execute the rendering commands for you nor can we make all of the rendering and output decisions for you.

How can I upgrade my CS5.5 design standard to CS6 extended?

Please help me

Theoriginalevol please see Upgrading to CS6 from CS5.5, CS5, CS4, or CS3 - http://www.adobe.com/products/creativesuite/upgradeinfo.html for information regarding upgrades.

How do I upgrade my master collection cs5.5 to cs6?

I have the Master Collection cs5.5 but I haven't found any help or anything on upgrading it. Help?

Are you under the impression that this upgrade is free?

Fluid grid website is showing up as two-columns even on very large monitors in IE10

In Firefox and Chrome, the website looks and functions just fine. However, viewing on the same large monitors in Internet Explorer, the webpages are broken up into two columns. To see what I mean, the site is www.PixelHallPress.com

Yes, I use code view and I put the tags you suggested exactly where you had suggested. No, I am not a coder, but I'm pretty good at following directions. Yes, I've been known to make mistakes. Most of the time it's because I know a little code, but not enough to keep myself from getting into trouble (or help get out of it).
The thing is that this website has been behaving just fine for about a year. It works fine in other browsers. IE is the only problem. I tried applying the template from two earlier versions that I know worked previously, and they too are having the display problem in IE
I'm no longer getting that error code, by the way. However, when I place <body> then </body> tags I get an error message that I have an unbalanced body tag. I wonder if the fluid grid template creates its own version of a body tag.
One variable: The host has migrated the site to a new server. Could this have introduced some errors?
I appreciate your advice. Thanks, Sally

How do I upgrade a fluid grid template created in CS6 to CC?

Similar Messages

Maybe you are looking for