Html Editor Tips and Tricks - Page 1


Ambassador
2,648 posts

Share your tricks or tips for Code Mode of the HTML EDITOR with others!

This thread is for tricks and tips only - please no problem questions. This is not an area to have conversations.

Have a problem or question or want to chit chat about this program then Start a new thread please.

When posting your tip or trick please, put a bold title at the top of the post about the subject. If you want to add a comment to existing one then use the "Quote Post". If you are adding to your existing idea that you posted, then PLEASE use the "edit post" feature to update your original posting.

Postings might be combined by monitor to keep subjects together.

Subscribe to this thread if you like to get emails on tips and Tricks people post


Ambassador
2,648 posts

Edit more than just html files

Did you know that you can create and edit php, txt, cgi and css files with this editor.

Great for editing most files you build your website with!


Ambassador
2,648 posts

On the fly Uploading!

There is a Name Box on the left hand side of the screen that you can select files from. You can also upload with too from this same place.

1. Control click all the files you want to upload to your server

2. Then right click on one of the higlighted files

3. Popup menu appears

4. Select Upload to Server

5. Then click your server and directory

If you have not yet defined your server to upload you can select the add/edit server feature too!

----------- Another way to upload quickly

Finished making changes to your file? Here is a quick way to save and upload your file.

1. Just right click while your in your file

2. Popup menu appears

3. Select Save

4. Right click again

5. Select Upload to Server and select your server


Ambassador
2,648 posts

Getting the line up on Line Toggle Numbers

Often many people like to have the line numbers show up on their files when they edit - this is very important for those who do php or cgi scripting and editing. Currently if you select from the Menu - View - Line Toggle Numbers, your file will plug in line numbering. However when you leave the editor and return they dissappear. No this is something that many of us hopes CC will change in a future upgrade. But you can currently do the below and have those Line Toggle Numbers at a click when you want them!

By using your toolbar customizing you can place the line number icon on your file tool bar and this is how you do it.

1. Open any file in Code Mode
2. Right click on the toolbar just below the code editor tab.
3. Select "Customize"
4. Select "Command" Tab
5. Select "View" and up pops in the window the commands for View
6. Scroll down to "Toggle Line Numbers"
7. Click and drag the toggle line number to the tool bar below the code editor tab.

Now you can just click the icon when you need to see line numbers.

See It In Action - Click Here (warning: ~300kb file)
* * * * * * * * * * * :) * * * * * * * * * * * *


Registered User
198 posts

Editing Page Hint

If you're editing a page and you're not sure how it will come out don't save it and close CC down because you will have lost your original version.

Just save the page, upload to your server, check it out and if it's not quite right or you were happy with the way it looked before then just keep clicking on the undo button (or cntrl Z) until you get back where you originally started from then re-upload the page to your server again.


Registered User
4,316 posts

Creating folders on your Server from HTML Editor

Many designers create folders and sub folders to organize their files on their severs. You can create these folders on your server right from CC HTML EDITOR :

First example if you would like to create several folders on your server at one time:

You should already configured your server settings for this example:

1. Go to File on the CC HTML Editor Tool Bar
2. Rest your mouse on "Upload File to Server" for a popup window.
3. Click on "Add or Edit Servers". . (If you have not configured your Server(s), this is a good place to add them, first. Remember: This tip is for servers already configured)
Example1:
http://www.darcejean.com/advisor/cchelp/one.png
4. Click on the "Add or Edit Servers" and a new window will pop up.
Example 2:
http://www.darcejean.com/advisor/cchelp/two.png
5. Click once on the server you would like to Edit and on the right hand side of the window, click on "Edit". A new window will popup.
6. Look for the the section "Remote Directory" so you can create your folders in the window provided. You need to establish the path to where your server stores your files. You can contact your server to find this path. Below are three examples to add the path to your server and additional folders to your directory.
Example 3:
http://www.darcejean.com/advisor/cchelp/three.png
1. Type in 'path of your server to your main directory' to upload folders to your main directory and select "Add" on the right hand side of the window.
(You can see by the first listing that the path to the files on my server is: '/'. You need to find out from your server what the path to your files are.
2. To add additional folders: type the'path to your server/new_ folder_name' and select "Add" on the right hand side of the window.
3.To add sub folders: type'path to your server/new folder name/new_sub_folder' (If I wanted sub folders) and select "Add" on the right hand side of the window.
Example 4:
http://www.darcejean.com/advisor/cchelp/four.png

Second Example for when you want to "upload on the fly" as posted by Kim.
1.In the Name Box on the left hand side of your screen in HTML Editor, right click on the file or folder you would like to upload, a window will pop up, rest your mouse on "Upload File to Server" for another menu to appear: next--
2. Click on "Add or Edit Servers".
3. Click on the Server you would like to Edit.
4. On the right hand side of the window, click on "Edit". A window will popup.
5. In the section "Remote Directory"create your folders in the window provided.
6. Type in the name of your folder('path to your server/new folder name')and select "Add" on the right hand side of the window.

Note:Naming file and folders: I make a practice of using all lower case characters and I add '_' (the underscore character)between words, if I would like to have more than a one word folder or file name. Example: 'my_folder' or 'my_file.html'
Darce Jean


Ambassador
6,076 posts

Directory preferences
Setting up your working folder


If you are working on a site, and want your HTML Editor to open to the same directory for that site content every time, first of all make sure you have prepared a folder and are saving all the content for the site in that uniquely named folder on your hard drive, and then open the Editor.

1.Go to TOOLS and right at the bottom of the TOOLS MENU you will find PREFERENCES.
2.Open the preferences window, and choose the tab for DIRECTORIES along the top of the window
3.You will be presented with another window where you may select various prefences for your images folder and other.
4.Use the little folder icon over to the right and
browse to the uniquely named folder you have already created.
5.Select the folder and click OK
6.Back in the directories preference window you can also check the 2 little boxes to be reminded if you are saving your images and web pages into the correct folder.


Ambassador
6,076 posts

How wide should I make my page? [updated May 2010]

This has presented itself as a common dilemma on many occasions. It seems to be the general opinion (as of January 2010) that you can now calculate for 1024 x 768 as being the lowest screen resolution around these days, and a 1280 x 1024 or x 800 resolution as having the lion's share percentage wise (followed closely by 1440 and 1680 widths). There is now quite a significant number of users of these bigger screens/resolutions.
To be user-friendly at both the smaller sizes, a page of a maximum 980 width (height is not that important and should stretch according to your content) seems to be acceptable. This width allows for the space taken up by the scroll bar, and for the default left-hand margin created by many of the browsers.
All this means is that you are trying to create a pleasant surfing interface for those who use both those screen resolutions.
You can check out the effect by right-clicking on your desktop and changing the settings of your own screen in your control panel. That way you can see how your pages look in both those resolutions.
You would also be wise to check out your pages on several browsers. We suggest at least 5 browsers, namely Firefox, Internet Explorer, Chrome, Opera and Safar.
Download these and keep them on your pc for the occasional check.
Be ready to make a few changes to the site pages which were looking perfect on one browser - and appear totally different on another!


Registered User
2,900 posts

Keyboard shortcuts

To insert a <br /> tag - use shift-enter

And some more:

Open and Save
Shift Ctrl N = New Blank Page
Ctrl O = Open
Ctrl S = Save
Shfit Ctrl S = Save As
Ctrl P = Print

Searching
Ctrl F = Find
Ctrl H = Find and Replace
F3 = Find Next

Basic Functions
Ctrl Z = Undo
Ctrl Q = Redo
Ctrl X = Cut
Ctrl C = Copy
Ctrl V = Paste
Ctrl A = Select All

Screen
F12 = Split Screen

File Name Box
Shift Ctrl F4 = show files as icon
Shift Ctrl F5 = show files as list
Shift Ctrl F7 = show files as detail
Shift Ctrl F8 = show files as small icons
Shift Ctrl F9 = show files as thumbnails

Insert Objects
Ctrl L = Link
Ctrl T = Target
Ctrl E = Email Link
Ctrl M = Image
Shift Ctrl C = Comment

Formats
Ctrl B = Bold
Ctrl I = Italic
Ctrl U = Underline
Shift Ctrl . = Indent
Shift Ctrl , = Un-indent
Ctrl Enter = Page Break
Shift Enter = Line Break

Preview in browser
Ctrl F5 = Favorite Browser
Ctrl F9 = Default Browser
Ctrl Alt 1 = Browser you define 1
Ctrl Alt 2 = Browser you define 2
Ctrl Alt 3 = Browser you define 3
Ctrl Alt 4 = Browser you define 4

Bookmarking for editing
Shift Ctrl 0 = set bookmarker 0
Shift Ctrl 1 = set bookmarker 1
Shift Ctrl 2 = set bookmarker 2
Shift Ctrl 3 = set bookmarker 3
Shift Ctrl 4 = set bookmarker 4
Shift Ctrl 5 = set bookmarker 5
Shift Ctrl 6 = set bookmarker 6
Shift Ctrl 7 = set bookmarker 7
Shift Ctrl 8 = set bookmarker 8
Shift Ctrl 9 = set bookmarker 9

Execute set bookmarker for editing
Ctrl 0 thru Ctrl 9 - depending on what you have
set up for bookmarkers

Insert a Non-Breaking space (&nbsp;)
Ctrl Spacebar
Have fun
~ Fe Pixie ~


Ambassador
2,648 posts

Bookmarkers to work from

Often if you are editing or creating large files with many lines like php and such you can set up book markers and then easily go between them. For example the other day I had over 1000 lines of code to edit in a php file. I had to switch back and forth between several locations working on page layout.

To save me time:

I went to the first line I was working on and pressed Shift Ctrl 1 to set my first bookmark. Then went to the next place and pressed shift ctrl 2 and on and on. After I set my bookmarks - I could just press ctrl 1 and it move me to the first line, ctrl 2 and I move to the next line I set. It is great for going thru many lines of code.

To set your bookmarker simply press shift ctrl and a number between 0 and 9
to execute that bookmarker press ctrl and the number you assigned it.


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.