Many content types in MyCashflow have a text field, in which you can format contents by using our graphic text editor.

Such content fields can be found, for instance:

Enablement

If your online store still doesn't use the new text editor in all text fields, you can enable it for the whole store by using the editors' bulk change tool.

The bulk change can be initiated via the notification displayed above the text editor.

If you wish so, you can also enable the new editor on individual pages. In this way, you'll be able to test the new editor before enabling it for the whole store.

Inline formatting

In MyCashflow's WYSIWYG text editor, you can easily use the most popular inline formatting in the text.

Below you'll find the inline formatting options available in the WYSIWYG text editor:

  • : Bold
  • : Italics
  • : Underscore
  • : Strikethrough
  • : The text editor contains multiple, ready-to-use styles that enable you to create versatile text elements.

    Heading styles can be used for creating the HTML headings h1–h6. You may want to use the styles whenever you create a heading.

    The Quote style enables you to create indented paragraphs.

    The Code style enables you to write a text with an even font, where no inline formatting can be used.

  • : Text position (e.g. alignment to the left or right)
  • : Add lines to the text to visually separate consecutive paragraphs.
  • : Set the text's font and background colors

Using lists in texts

In the MyCashflow text editor, you can use both ordered and unordered lists.

To create a multilevel list in the MyCashflow text editor, indent the selected items by using the toolbar's indentation buttons >Indent and <Outdent.

You can also use lists of different types within other lists. In such a case, select, for instance, a numbered list item that you'd like to convert into an unnumbered item, and click the relevant list button in the editor's tool menu:

Using tables in texts

In the MyCashflow text editor, you can add tables to the text with the help of the easy-to-use table tool:

Read more about the MyCashflow text editor.

  1. Select the Insert table option from the table menu .
  2. To edit the table's size, use the relevant options in the table menu.
  3. If you wish so, you can also add a heading row to the table:

You can remove rows and columns at any time by using the options in the editor's table menu. You can also delete the entire table.

Using images in content fields

There are multiple ways of adding images to content fields.

To add images to the text either drag them from your computer to the desired location within the text or use the editor's image tool:

  1. Open the window for adding images by clicking the image button .
  2. To add a new image file, drag or select it from your computer in the Upload tab.
  3. To use an image from your online store's file directory, go to the Choose tab, and select the desired image.

    Using product images in content fields is not possible. Instead, you can use any of the images that have already been used in other content fields.

    If you'd like to use other images, you'll have to upload them separately by using the functionality for uploading images in content fields.

    You can also copy the desired product images to the file directory /files/content_images to make them available for use in content fields.

  4. Close the window for adding images.

Content images' location in the file directory

The images added to content fields are automatically saved in the online store's file directory /files/content_images. The easiest way to find it is by using the file browser.

Resizing images in content fields

After adding an image to the content field, you can change its display size.

  1. Click the image in the text field.
  2. Grab the square in the image's lower right corner, and resize the image by dragging it:

Resizing the image in the content field does not change the size of the image file – the image will simply be displayed in a different size.

Other ways of modifying images

To see other options for editing the image, click Edit in the middle of the image:

You can define the following settings for images:

  • Title: A text that is used e.g. as image alt text in the default theme.
  • Caption: A text that is displayed as a caption under the image e.g. in the default theme.
  • Position: Image alignment to the left, right or center.
  • Link: A URL address that users are redirected to when clicking the image.
  • Open link in new tab: Sets the link to open in a new tab in the browser.

    Enter the online store's internal links in the format /product/5 and external links in the format https://www.example.com.

Adding links to texts

You can add to the content text links both to the online store's contents as well as to external pages.

Creating text links

To add a text link:

  1. Select the text that you'd like to use as a link text.
  2. In the editor's toolbar, click the link button .
  3. Select Insert Link.
  4. To create a link to one of your online store's pages, use the search field in the Select page drop-down menu:

    Type at least three characters in the field to initialize the search. The search targets products, product categories and brands, as well as content pages.

    Select the desired page from the search result list.

    The online store's internal links can also be entered in the URL field in the format /product/23 (the number should be replaced with the destination's ID number).

  5. To add a link to an external address, enter the link's URL address.
  6. Optionally, select the option for the link to open in a separate tab.
  7. Click Insert.

Adding links to images

To add a link to an image that has been added to the contents, follow these steps:

  1. First, add an image to the contents.
  2. Click the selected image's Edit button.
  3. Define the settings for the image link:
    • Title: A text that is used e.g. as image alt text in the default theme.
    • Caption: A text that is displayed as a caption under the image e.g. in the default theme.
    • Position: Image alignment to the left, right or center.
    • Link: A URL address that users are redirected to when clicking the image.
    • Open link in new tab: Sets the link to open in a new tab in the browser.

      Enter the online store's internal links in the format /product/5 and external links in the format https://www.example.com.

  4. Save the settings for the image link.

Embedding videos in the editor

In the MyCashflow text editor, you can embed videos from external services (such as Vimeo and YouTube).

Many video sharing websites have options for sharing and embedding videos, from which you can obtain a HTML code snippet that you can then add to the contents in the MyCashflow text editor to display the video on your website.

For more information, see the instructions on services' websites:

Example: How to embed a YouTube video

  1. Open the desired video on YouTube and open the Share menu from the video tools:
  2. In the Share menu, select the Embed option, and copy the embed code from the text field.
  3. In the MyCashflow admin panel, open the form for editing the desired contents, and enable the new editor for the content field if you still haven't done so.
  4. Switch to the HTML markup view by clicking in the editor.
  5. Paste the embed code you've copied earlier at the desired location, and switch back to the regular editor view by clicking once again.

    The embedded video should now be visible in the content field.

  6. Save the edited contents, and make sure that the video looks good on the page.

Embedding audio files in the editor

In the MyCashflow text editor, you can embed audio files from external services (such as SoundCloud).

Example: Embedding an audio file from SoundCloud

  1. Open the desired audio file in SoundCloud.
  2. In the file's tools, click Share.

    The share window opens.

  3. In the share window, go to the Embed tab.
  4. Copy the embed code from the Code field.
  5. Go to the page on which you'd like to embed the audio file and open the HTML view in the text editor by clicking .

    If you still haven't enabled the new editor, do it now.

  6. Paste the embed code to the source code at the location at which the file should appear in the contents.
  7. Save the changes, and make sure that the file is displayed properly on the page.

Using HTML code in the editor

If you are skilled in HTML, you can process the content markup without using the tools provided in the editor.

To view the HTML code, in the editor's toolbar, click .

After making all the necessary edits in the HTML code, click once again to switch back to the graphical view. The changes will be updated in the editor immediately.

Not all HTML tags are displayed in the admin panel's content preview, but they will be visible in the store's public area.

Some HTML tags are deleted from the contents automatically (e.g. <script>).

Using Interface markup in the text editor

You can use MyCashflow's Interface tags directly within text. To add longer pieces of markup to the text, you may want to use the Interface markup functionality.

Learn more about using MyCashflow's Interface tags.

To add to the text those Interface tags whose attributes don't require editing:

  1. Open the desired page for editing.
  2. Type the desired Interface tags at the relevant position.

    In this example, we add the online store's contact details to the text. You can add tags either within the text or as separate paragraphs.

    See MyCashflow's Designer's Guide for an extensive list of the available Interface tags.

  3. Save the page.
  4. Visit your online store's customer area to make sure that the Interface tags print the desired contents within the text.

In this section, we dealt with Interface tags whose attributes don't require editing. In the next section, we show how to add custom HTML markup to tags.

Using attributes with markup in the text editor

Some Interface tags have attributes with which you can use custom HTML markup. In such cases, you should add the Interface tags to the text by using the editor's Interface markup tool:

  1. Open the desired page for editing and navigate to the relevant content field.
  2. In the text editor's toolbar, click the Interface markup icon.
  3. In the window that opens, type the desired Interface markup.

    In this example, we add a list of products that are compatible with the product that is edited.

    The before attribute is used for defining the title of the product list.

    The helper attribute makes use of the online store's theme file themes/shop/THEME/helpers/list-product.html

    See MyCashflow's Designer's Guide for an extensive list of the available Interface tags.

  4. Click Insert.
  5. Save the page.
  6. Visit your online store's customer area to make sure that the Interface tags print the desired contents within the text.

The contents produced by the Interface markup that you've just added is now displayed on the page.

You can edit the markup at any time. To do so, place the cursor anywhere within the markup, and click the Interface markup button in the text editor's toolbar.