In Infigo Designer, it is possible to show a field in the editor, but hide it when the output file is generated. This can be useful in many situations, such as if there was a logo present on the stock which your output was being printed on and you wanted the editor to reflect this, but not be on the output. You could have the image be visible in the editor, but hidden on the output so that whilst the user sees a true representation, the output file will not include this logo.

This can also be used to show or hide crop marks on the output creation, allowing your print-ready artwork to contain crop marks without your user having to see them in the editor.

To achieve this, you will need to utilise our Javascript wizard, as well as our prepare strings. This article will explain how you can use these tools to achieve this goal.

First, you will need to have at least two fields in your PDF. However, for this article I will include three:

• A text field which will be used by the script to determine if the output should be shown or not
• An image field which will be hidden on the output creation
• A separate text field which will be used to show that the only element of the PDF affected by the script is the image field

 As you can see in the screenshot below, I have created the first field off of the artwork in the PDF, and the second and third fields on it. This is because I do not want my users to see a field which is only used for the script, and creating it off of the artwork will allow the script to still use the field without the users seeing it. I have highlighted the script field in blue so you can more clearly see its location.

You do not need to do anything special with these fields' configurations and properties, as this will mostly be driven by the script. However, you will need to ensure that the names are appropriate and can easily be remembered when producing the script, so take note of what you have called each field after creating it. I have also made the image field a Fixed Value so that the user cannot change it within the editor (however the script will still be able to edit this as it will bypass this property).

It is also advised to make the field off of the artwork (which I will refer to as the trigger field from now on) read-only so that your users cannot interfere with the script. It will likely not affect the output if they are able to edit this field, but it can affect the behaviour within the editor itself.

Note: If you set the trigger field to Fixed then it will not be able to be changed on output creation, and so the script will not work.

You will need to set the pre-defined value of this text field to False - this is done through the Text Editor as seen in the screenshot below.

Once you have configured this, you will need to create the script, which you can either write yourself as Javascript, or you can use our Javascript Wizard. I will explain how to produce it in the wizard below.

In order to load the wizard, you will need to enable advanced mode for your Infigo Designer plugin. To do so, simply open up a PDF with the Infigo Designer plugin installed, then open the Infigo Designer menu and select Configuration. This will load the popup menu below, in which you will need to check the Advanced Version box and click Ok before re-launching Adobe Acrobat.

Now, when you re-open your PDF, you will be able to access Infigo Designer -> Javascript Management. 

In the menu which appears, you will be confronted with a menu which will show you all of the scripts which you have previously created in this PDF. In order to load the script wizard, simply click Wizard.

Upon clicking this button, the following editor will open:

This is our drag & drop Javascript wizard which allows you to create simple to complex Javascripts for your PDF. 

The first thing we will need to do in this script is add a condition. What this will do is basically make the script check something and depending on the outcome of this check, it will either do one action or another. In our case, the check will be checking the value of a text field, and then either showing or hiding the field depending on its value.

To add the condition, you will need to expand the Control Flow folder in the Functions menu on the left, and then drag the world Condition into the green Item box in the grey area, which will result in the screenshot below.

Now that we have told the script there is going to be a condition, meaning it will have to check/test something, we need to tell it what the test is. We will be testing to see if the text value of our Trigger field is equal to True or False. 

To achieve this, we will need to now collapse the Control Flow folder, and instead expand the Comparison folder. After this, we will need to drag the text equals to value over to the Test section of the condition. Doing so will result in the screen seen in the screenshot below.

Now that the script knows it needs to compare two text values, we need to tell it which values to compare. The order in which we add these doesn't matter, however for the sake of making it as human-readable as possible, we're going to essentially make the script ask "Is the trigger field equal to False?"

To do this, we are going to now collapse the Comparison folder in the left, and instead navigate to the Items area on the right of the document. In here, we will need to expand the folders Text Fields -> HideField (our trigger text field) -> Get... -> text value:  and drag Text Value from this folder into the red A section of our text equals to script area. 

This will result in the script looking like the screenshot below:

Next, hover over the B section - this will cause a small popup with the word Text to appear. 

Clicking on this will cause yet another popup to appear, in which you will be able to enter the text we will be checking the Trigger field against. In this instance, I will be using the word False. Take note of the exact characters and casing you used for this word, as we will need to make sure that this is perfectly matched in our later configuration.

After adding this text and clicking OK, the script sequence will now look like this:

At this point, the script is essentially asking the question "Is HideField set to false?" and depending on the answer to the question it will either follow the If Branch if it is true, or the Else Branch if it is not.

Now that we have the condition set up, we will need to set up the actions. As we are asking if HideField is true, it would make the most sense to hide the field if the answer is Yes, so we will configure the If Branch to achieve this. To do this, look to the Items section on the right half of the page and expand the folders Image Fields -> Logo Image Field -> Set... -> field value: and drag the visibility attribute over the If Branch. See below for a screenshot of the attribute which needs to be dragged, as well as the visible result of this action.

This will fill the script so that it is trying to set the value of the visibility attribute of this image field. Basically, the visibility attribute determines whether or not something is visible, both in the editor and in the final artwork. So, if the value of HideField is False, then we will want to make the field visible, which we can do by setting the visibility attribute to true.

The easiest way to do this is to hover over the Value field, and click on the white text saying Logical Value.

This will open a popup which allows you to determine which value to set the field to through the use of a simple checkbox. If the checkbox is ticked, then the value will be true, and likewise if it is not ticked, the value will be false. For our purposes, we will want to ensure that the box is ticked. 

Next, click OK and the Value will be replaced with a Logical Value that is true.

The script is almost complete, now we just need to configure the Else Branch. Thankfully, this follows the same principle as the If Branch, and is almost identical in fact. The only real difference is the Logical Value, as this time we will want it to be set to false instead of true. This is because if HideField is set to True, then we will want to hide the field, and since HideField will no longer equal False, the script will go down the Else Branch. 

Since we have concluded that the Else Branch should hide the field, we will need it to set the visibility attribute of the field Logo Image Field to false. To do this, follow the exact same steps outlined when configuring the If Branch, except make sure that you do not tick the box in the Constant Value pop-up menu. 

If you have configured the Else Branch correctly, then the script should now look as follows:

The script is now complete, and all that's left to do is add a description, a name, and save it. The description and the name is up to you, however we advise that you ensure that both the name and description are relevant and appropriate. 

To provide these, you will need to utilise the Script Details section in the top-left of the editor UI. See the screenshot below for an example of both the name and the description.

Once you have finished with the name and description, click OK in the bottom-right hand of the UI, then click OK again in the Javascript Management menu.

The script is now saved and your PDF template should now be finished and ready to be uploaded against a product. See here for further instruction on how to do this.

All that is left to do is to configure the storefront so that the value of HideField is set to True on output creation.

In order to achieve this, you will need to navigate to Configuration > Settings > Product and Editor Settings > Infigo Settings and navigate to the XML and Prepare String Data tab.

As you can see in the screenshot above, it is very easy to assign the value of HideField. All we need to do is type it in using the format <Field Name>=<Value on Output>. This will only take place during output creation, so it will not affect the editor whatsoever. Once you have mapped the value to the field, simply click Save and then it's time to test the product. (please note*** new strings added require an app server recycle - these are performed nightly - so will need 24 hours to let this setting to be active).

In the screenshot below, I have loaded the product I just created on my storefront and changed the text to ensure that my changes to fields not included in the script are unaffected.

As you can see in the screenshot below, the text I entered has been retained, yet the image field is no longer visible. 

I have attached both the PDF created in the making of this article and the output file of the order I placed when testing the product.

The logic in this article can be flipped so that the image field is instead hidden in the editor and shown on the final output, which could be useful if you wanted to include crop marks etc. without your customers seeing them. To do this, simply swap the If Branch and the Else Branch.