beautypg.com

Adobe Dreamweaver CC 2014 v.13 User Manual

Page 701

background image

3. Your options vary, depending on your selection.

If you selected a div, th, or td tag, Dreamweaver transforms the tag into an editable region without any further steps.

If you’re inserting a new, blank editable region do one of the following:

Select Insert New Editable Region at the Current Insertion Point and click OK. Dreamweaver inserts a div tag in your code with the
ice:editable attribute in the opening tag.

Select Transform the Parent Tag Into an Editable Region if you want Dreamweaver to make the parent tag of the selection the
container element for the region. Only certain HTML tags are transformable: div, th, and td.

Note: This second option is only available when the parent node meets the exact criteria for transformation. For example, it must be
one of the listed transformable tags, and it must not be subject to any of the errors listed in InContext Editing Error messages.

If you selected a Dreamweaver template editable region, click OK in the Create Editable Region dialog box. Dreamweaver wraps the
template editable region with a div tag that acts as a container for the new InContext Editing editable region.

If you selected other content that you want to make editable, do one of the following:

Select Wrap Current Selection With a DIV Tag and Then Transform It if you want to wrap whatever you selected with a div tag and
turn it into an editable region. The div tag with which Dreamweaver wraps the content acts as the container for the editable region.
Note: Adding div tags to pages might alter page rendering and the effects of CSS rules. For example, if you have a CSS rule that
applies a red border around div tags, you would see a red border around your current selection when Dreamweaver wraps it with a
div tag and transforms it. If you want to avoid this type of conflict, you can rewrite the CSS rules that affect the current selection, or
you can undo the transformation (Edit > Undo), and then select and transform a supported tag that Dreamweaver doesn’t need to
wrap with a div tag.

Select Transform the Parent Tag Into an Editable Region if you want Dreamweaver to make the parent tag of the selection the
container element for the editable region. Only certain HTML tags are transformable: div, th, and td.

4. In Design view, click the blue tab of the editable region to select it if it’s not already selected.

Note: If you are working in a Dreamweaver template, be sure to select the InContext Editing editable region (the container region), and not
the Dreamweaver template editable region.

5. Select or deselect options in the Editable Regions Property inspector. The options you select will be available to a user when they edit the

contents of the editable region in a browser. For example, if you select the Bold option, the user will be able to make text bold; if you select
the Numbered List and Bulleted List option, the user will be able to create numbered and bulleted lists; if you select the Link option, the user
will be able to create links; and so on. Hover over the icon of each option to see a tooltip of what the option enables.

6. Save the page.

If this is the first time you’re adding InContext Editing functionality to a page, Dreamweaver informs you that it is adding InContext Editing
supporting files to your site: ice.conf.js, ice.js, and ide.html. Be sure to upload these files to the server when you upload your page,
otherwise InContext Editing functionality will not work in a browser.

Create an InContext Editing repeating region

An InContext Editing repeating region is a pair of HTML tags that includes the ice:repeating attribute in the opening tag. The repeating region
defines an area on the page that a user can “repeat” and add content to when editing in a browser. For example, if you have a heading and a
paragraph of text that follows it, you can transform these elements into a repeating region that a user can then duplicate on a page.

694

This manual is related to the following products: