Saltar apartados

Use of the tables in the editor

In this document:

Buttons for the use of tables.

Creation and properties of tables:

Operations on rows:

Operations on columns:

Operations on cells:

Staff to remove tables

Insert new table

New icon tableThe use of the tables has to reduce to the indispensable, and never have to use for maquetar the content of our page. An example of correct use of the tables would be for example a listing of Students with his name and his notes:

Notes of students
Student Practices Examination FINAL NOTE
Student 1 6 4 5
Student 2 6 8 7
Student 3 N.p. 8 N.p.
Student 4 9 9 9

Every time that press to Insert New table, appears us a picture where can establish:

  • Rows and Cols: the number of rows and columns.
  • Alineación: The alineación inside the document.
  • Edge: the size of the edge of each cell,
  • Summary: a summary (compulsory) descriptive of the information of the table (the which can use to his time like foot of table), and finally,
  • Formats of table: any of the designs of table predetermined.

In the image to continuation can see the options selected for the previous example:

Example dialogue insert new table

When pressing "Insert" appears us the empty table but with the format indicated.

Formats of table

In this subapartado will explain which types of format and disposal can choose and also like removing it. Are the available options those that show in the dialogue to Insert/Modify table:

Formats of table numbered

  1. Cabecera With bottom in blue dark and rest in blue clear.
  2. Cabecera With bottom in blue dark and rest in white.
  3. Cabecera With bottom in blue dark and rest in white and blue clear alternatively.
  4. Cabecera Of 1 cell with width of the table with dark blue bottom and the rest with bottom in blue clear.
  5. Cabecera Compound by the first row and the first cell of the second row with dark blue bottom and the rest with bottom in blue clear.
  6. Cabecera Formed by an only cell with the size of the height of the table being the first column with dark blue bottom and the rest in blue clear.
  7. Cabecera Formed by the first column with dark blue bottom and the rest in white bottom.
  8. Without style: it does not put style or removes the existent.

Properties of the table

Option properties of the tableTo see the properties of the table situate us in any cell of the table and by means of the use of the contextual menu that opens when pressing on the right button of the mouse execute this action. It appears us the same dialogue that "Insert table" and that see to continuation:

Example dialogue insert new table

It is important to remember this action since when hitting tables of external pages in VUALÀ is necessary to specify the field Summary so that it allow the publication. It is necessary to put the summary of the table in the three languages.

Properties of the row

Icon properties of the rowBy means of this tool can change the style and format of the rows of our table. When pressing on the button of Properties of row will see the following information:

Dialogue of properties of a rowWe describe to continuation what is each option:

  • Type of row: it allows to change the behaviour of the row. The row will be able to change to the following types:
    • Cabecera Of the table: it becomes the cabecera situating in the high of the table (if there was more than a row of this type will have in the order of allocation, that is to say, the first that was cabecera will remain the first, the second that assigned will remain the second, etc...). The usual (but is not compulsory) is that it only exist a row like cabecera.
    • Body of the row: it becomes a normal row situating under the cabecera.
    • Foot of the table: it becomes the foot of the table situating in the inferior part.
  • Alineación: It ranges the content of the cells to the position indicated (left, centre or right). By left defect.
  • Alineación Vertical: it ranges the content of the cell in the vertical position indicated (up, centred or down). By defect centre.
  • High: we will use it to specify a determinate height for the table. The value that takes the row by defect is the 26.
  • Background image: it is not implemented.
  • Background colour: it allows to select one of the corporate colours of the UA like bottom of the row.

    Palette of corporate colours

The configuration of the properties will be able to apply to:

  • Only the current row
  • To the rows impares
  • To the rows stop
  • To all the rows

In function of the option that select in the desplegable situated in the inferior part left of the picture of dialogue, here shows his location:

Desplegable For multiple application

Finally, we press "to Apply" so that they do effective the changes.

Properties of the cell

Button properties of the cellThe properties of a cell can modify pressing the button of "Properties of the cell". A dialogue with the options opens us and, to continuation, details what is each option:

Properties of the cellIn the General eyelash have of the following parameters:

  • Alineación: It ranges the content of the cell to the position indicated (left, centre or right). By left defect.
  • Alineación Vertical: it ranges the content of the cell in the vertical position indicated (up, centred or down). By defect centre.
  • Width: width of the cell.
  • High: high of the cell
  • Type of cell: the types are
    • Data: the cell takes the format of normal cell.
    • Headed: the cell takes the format of cabecera (the text appears bigger).
  • Background image: no implemented.
  • Colour of the edge: it allows to change the colour of the edge if it exists.
  • Background colour: it allows to change the background colour of the cell.

The colours that can assign are the corporate. In the following image shows the palette of colours:

Palette of corporate colours

To the equal that in the properties of the row, can apply all the changes of multiple form. In this way, by means of the desplegable of the left inferior part (and that shows to continuation) will be able to extend the configuration of cell to:

  • The current cell
  • The cells of the same row
  • All the cells of the table

We see it in this image:

Desplegable For application multiple of cellsFinally, we press "to Apply".

Delete a table

Option Delete TableTo delete a table situate us in any cell of the table and by means of the use of the contextual menu that opens when pressing on the right button of the mouse execute this action. It does not require confirmation, but can undo (Ctrl+Z).

It remembers:

It is necessary to use the contextual menu associated to the table doing click-right in the mouse. It does not exist a button in the bar of tools to delete tables.

Insert row (before)

Button Insert row (before)It allows to modify the structure of the table inserting a new row above the row in which have the cursor.

The new row adopts the styles and formats of the row where is situated the cursor.

We suppose again the example of the table of students. If we insert a new row with the cursor in "Student 1" obtain the following table:

Notes of students
Student Practices Examination FINAL NOTE
Student 1 6 4 5
Student 2 6 8 7
Student 3 N.p. 8 N.p.
Student 4 9 9 9

However, if we do it in the cabecera, on the column NOTICES FINAL, the result would be:

Notes of students
Student Practices Examination FINAL NOTE
Student 1 6 4 5
Student 2 6 8 7
Student 3 N.p. 8 N.p.
Student 4 9 9 9

Insert row (afterwards)

Button Insert row (afterwards)

His behaviour is similar to insert row (before) save in that the new row inserted situates underneath of the row where is situated the cursor.

Suppress row

Button Delete row

It suppresses the row in which it is situated the cursor. This action does not ask confirmation, but can undo (Ctrl+Z).

Insert column (before)

Button Insert column (before)It allows to modify the structure of the table inserting a new column to the left in which have the cursor.

The new column adopts the styles and formats of the column where is situated the cursor.

We suppose again the example of the table of students. If we insert a new column to add the note of the an examination type test, do not situate in the column of "Examination" and insert the new column (before):

Notes of students
Student Practices Examination FINAL NOTE
Student 1 6 4 5
Student 2 6 8 7
Student 3 N.p. 8 N.p.
Student 4 9 9 9

Insert column (afterwards)

Button Insert column (afterwards)

His behaviour is similar to insert column (before) save in that the new column inserted situates to the right of the column where is situated the cursor.

Suppress column

Button delete column

It suppresses the column in which it is situated the cursor. This action does not ask confirmation, but can undo (Ctrl+Z).

Link cells

Button Link cellsLink cells is the equivalent action to combine cells in tools like Excel. However the tool "Link cells", when working with code HTML (being this trasparente for the user), has some limitations and, in case to be used, advises do it slowly and with caution to avoid effects no wished on the structure of the table. In any case, allows undo (Ctrl+Z).

A resticción to the hour to link cells is that the first cell (taking the more to left and up) of the selection has to contain text so that it activate the tool "Link cells".

The links of cells exists in some of the formats of table (4, 5 and 6) that can define . Said links already comes established, and, could delete if it wishes using the tool "Divide cells" explained in the previous section.

We see an example of table with a row combined and a column:

Notes of students
Student Announcement Practical + Examination FINAL NOTE
Student 1 FEBRUARY 6 2 4
JULIO 6 8 7
Student 2 FEBRUARY N.p. 8 N.p.
JULIO 9 9 9

On the example of the table with notes of students have done some modifications. The cells of cabecera with the Practical "text" and "Examination" have linked to form an only cell with the Practical "text + Examination". On the other hand, each student has two rows with his notes of FEBRUARY and JULIO. For this have linked two cells to form an only with the name of the student and that cover the two rows.

The cells combined keep the format and style of the first cell selected (that, as it remembers , has to have text). In our example, has changed the background colour of the cells affected using the tool "Properties of cell" so that the user identify the cells linked.

Divide cells

Button divide cellsReverse action to "Link cells". Only it can divide those cells that previously have been linked (or combined). It is necessary to situate the cursor on a cell linked (combined) and press "Divide cells". The effect is that the structure of the table recovers the cells linked (or combined) previously.

Notes of students
Student Announcement Practical + Examination FINAL NOTE
Student 1 FEBRUARY 6 2 4
JULIO 6 8 7
Student 2 FEBRUARY N.p. 8 N.p.
JULIO 9 9 9

On the table of the previous example have divided the cell (previously combined of "Student 1". The table recovers the cell for this row. It has marked in red the cells affected using the "Properties of the cell".

Computer service Manager of contents Vual


Universidad de Alicante
Carretera de San Vicente del Raspeig s/n
03690 San Vicente del Raspeig
Alicante (Spain)

Tel: (+34) 96 590 3400

Fax: (+34) 96 590 3464

For further information: informacio@ua.es, and for enquiries on this web server: webmaster@ua.es

Carretera San Vicente del Raspeig s/n - 03690 San Vicente del Raspeig - Alicante - Tel. 96 590 3400 - Fax 96 590 3464