Event Setup
      Back to home
      1. Knowledge Base
      2. Events
      3. Event Setup

      Advanced Web Page Editing

      Moving items in html, and doing extra styling that is not available from the iVvy toolbar, is something that you can do through the source code of the template.

      For those who are more knowledgeable in HTML you can also write your own css. This is for more HTML savvy users however, iVvy staff do not educate users on how to manipulate HTML code, but we give you the option to do so if you have the ability. For those that do not have a lot of experience in HTML will not know that you cannot just copy fonts or tables and paste them in another place without losing the formatting and code that is necessary to keep the formatting of the data being moved.

      This we will provide instructions and assistance for below to assist in moving your data around the page.

      Moving Tables
      If you created a table using the insert table button, then you can’t just drag across it and copy the code. You need to copy it in the source code, and paste it in the source code so that it takes the whole table formatting across with it.

      To move a table within your template:

      1. I would recommend putting in a place holder for your table first so you can find where to copy your table to easily in the source code. Put the cursor in the position of where you wish your table to be moved to and insert a table with one row and one column. Leave all the other options as they are.
      2. Then click on the “Source” button
      3. Click “CTRL + F” to do a search and type in <table>
      4. This will take you down to a table field within your template
      5. Check the table is the correct one that you want to move (not the place holder one that we created, you will see the example below) by scouring the next few lines and checking the text is that in fact that in the table you wish to move.
      6. Put your cursor before the < symbol of the <table> field, and drag and highlight the code down the page until you find </table> field. Highlight until after the > symbol. Right click and cut the code.
      7. Search the code for the placeholder you inserted earlier.

        It will look like this:

        <table border="1" cellpadding="1" cellspacing="1" style="width: 200px;">
            <tbody>
               <tr>
                  <td>
                  &nbsp;</td>
               </tr>
              </tbody>
        </table>

      8. Highlight all of the code above, and paste what you have copied of your existing table. Click on the source code again and your table will have moved. 

      Moving Text That Is Formatted

      Moving formatted text (text that is styled with fonts, font sizes, colors) can be tricky. If you cut and paste, as you paste the information you lose of the formatting that you have previously loaded. To move text and retain the formatting needs to be done in the source code of your document.

      To move the text within your document you will need to copy the paragraph and paste it elsewhere in the “Source Code” to retain the coding that formats it:

      1. Firstly I find it easiest to put in a place holder to made it easy to find in the source code where to paste your paragraph. I would recommend typing in something like placeholder, or aaa. Something that isn’t going to be a word within your document.
      2. Click on the "source" code button on your toolbar
      3. Click “CTRL + F” to bring up a find box and type in the first couple of works in your paragraph exactly as they are in your document. Your document will highlight where the text is from the search
      4. At the start of this paragraph there will be <p> which indicates the opening of the paragraph. You will need to put the cursor in front of the < symbol and then drag it down until you come to </p> which indicates the paragraph is closing. Stop the cursor after the > symbol, right click and cut. You have now copied your text and the web code that formats it.
      5. Now you will need to navigate to where in the source code that you wish to paste it, and the paste it. Do a “CTRL + F” again and search for your place holder text you created in step one. Lets say that we used placeholder. You will be taken to code that looks like this:
      6. <p> placeholder</p>
      7. Highlight the whole code by dragging your mouse over it and then right click and paste to replace it with your paragraph code.

      If at any time you make a mistake, click the cancel button instead of saving your template so you don’t lose the original information so you can try again.