Getting started: F2C step by step
With a basic understanding of what Form2Content is and can do, this article will explain step by step on how to create Joomla articles using F2C.
As an example we will be creating a front-end submission form for a BLOG. The example will work for both F2C Lite and Pro!
Step 1: Where will we save our Joomla articles?
With Form2Content we will be creating Joomla articles. These need to be saved in a category in order to be able to link to them later on. In our Joomla category manager, create a category called Blog articles.
Joomla back-end admin menu: content >> category manager
In F2C Pro it is possible to set a default category in the content type configuration. In F2C Lite the category for saving the generated article is in the submission form itself.
Step 2: Define a new F2C Content Type called Blog articles.
In the Joomla back-end navigate to the F2C Content Type Manager (image 1)
Menu: components >> Form2Content (pro) >> Content type manager
Create a new F2C Content type by clicking on NEW. Call it Blog articles and save it immediately!
If you have F2C Pro: Re-open your content type Blog articles and go the the (Section/)Category selection (image 2). Select for the default category the one you created in step 1 and save & exit!
We will come back later to provide the (display) settings for the front-end form and link to our custom template.
Step 3: Think about the fields we need and add them to the submission form
In order to create the Joomla article we will be collecting data using a form. The first step is to think which field (types) we need.
In the Content Type Manager click on the fields button (second column) next to the just created content type: Blog articles. This will bring you to the field manager (image 2, but empty).
For our example we will add the fields below. Please follow the links for more information on the settings of the individual fields.
Intro text (text area field type with max. 200 characters) Field name = intro_text
Main text (text area field type with max. 1000 characters). Field name =main_text
Intro image (image field) Field name = intro_image
Source url (text box field) Field name = source_url
For the image field, set the image size and make sure you have set the output to RAW! In F2C Pro you can also define the thumbnail size.
Having added the custom fields to your form, it is time to create the layout of the article.
Step 4: Create a custom F2C article template
The Form2Content Article Templates are used to make sure all articles look the same and that the data submitted in the forms ends up in the Joomla article.
In this example we want to create a layout for the article in the Joomla category blog view (intro template) and a layout for the full article (main template).
Part 1) Copy the default article templates and re-name them. This is easiest done using FTP (folder: media/com_form2content/templates) but can also be done via the Template manager in the back-end (download and upload the templates).
Part 2) Change the layout using html, Joomla plugin (code), CSS and the F2C template parameters. Editing templates can be done in any text or html editor.
Read more: About F2C Templates | Possible template parameters (and examples) | Creating a custom template | Adding Joomla plugins in your template | Plugin examples
Step 5: Link to the custom article template
Since we created our own article layout (templates) we need to make sure that the articles are created using our custom templates. In the F2C Content Type Manager, edit the previously defined Blog articles type.
(image 3)
Advanced article parameter settings: Because in our example we do not want to show the introduction (intro template content) in our article view, we need to set 'display intro text' to hidden. (image 4)
Finish by clicking on save!
Step 6: Test: Create an article via the back-end F2C Article Manager
Go to menu: components >> Form2Content (pro) >> F2C Article Manager
The F2C Article manager is almost identical to the Joomla one but instead of displaying a WYSIWYG editor when editing an article we display your custom form.
Part 1) Click on NEW and select from the drop-down the content type you want to create an article for.
Part 2) Fill out the form (article content), upload images etc.
Part 3) Check that the F2C template selection are pre-filled in the head of the article. If not you can add them here but don't forget to set them in the Content Type Configuration.
Part 4) Select a Joomla category where the article will be saved
Part 5) Save and publish.... only on publish will an actual new Joomla article be created.
Possible errors (on save and on publish): No category selected, no templates selected (on publish), Smarty errors in your template (might result in blank screen if you don't have error reporting).
Check: It's always possible to go to the Joomla article manager (JAM) and find the F2C created article. Please note that when you edit the article in the JAM, the editor can make changes to the html. Simply re-publish the article in the F2C article manager to undo any changes.
Step 7: Display the created Joomla articles
Since F2C creates Joomla articles in Joomla categories the easiest way to display them is to create a menu link (category blog layout) to the category where you save your articles.
The number of articles (and names) are unknown, you cannot link to the articles themselves untill they have been created! That's why a category blog layout menu link is easiest to use. Now the articles will just appear as they are created (with F2C).
Step 8: Create a menu link to the front-end F2C article manager
In both F2C Lite and Pro we can make a menu link to the F2C Front-end article manager. In general but especially F2C Pro, the front-end article manager is simplified making article submission even more easy. You also don't have to give visitors/clients back-end permission.
We recommend 'registered' user permission for F2C front-end article manager. If you wish to provide guest access we suggest you use Captcha (Pro only) and default unpublised settings.
Read more: Create front-end F2C menu link | Using Captcha & required fields (F2C Pro) |

