Step to create PageTemplate and Page in Hybris 4.8 e-commerce suite | Hybris 4.8 Tutorial



Steps to create a PageTemplate and page [All below examples are related to Home Page].

(1)    Create  PageTemplate which will have uid , restrictedPageTypes defines for which type of pages the template can be used.[ For ex: LandingPage2Template]
(2)    Create ContentSlotName associated to the pre-defined templates and declare validComponentTypes (what type of components can be associated to this section.).
[For ex:  SiteLogo, HeaderLinks, MiniCart, NavigationBar, Section1, Section2A, Section2B, Section2C, Section3, Section4, Section5, Footer].

(3)    Create ContentSlotForTemplate. Basically this is used for common area in all pages for ex: header ,footer [For ex: SiteLogo-LandingPage2, HomepageLink-LandingPage2, NavigationBar-LandingPage2, MiniCart-LandingPage2, Footer-LandingPage2, HeaderLinks-LandingPage2]

(4)    Create Page which will have association to the PageTemplate. [Ex:homepage]

(5)    Create ContentSlot. Depedending on the requirement these ContentSlots can be associated to the ContentSlotForTemplate or contentSlotForPage. Associate the required components to these contentslots.
(6)    [For ex: Content Slot NavigationBarSlot is associated to ContentSlotForTemplate NavigationBar-LandingPage2 and ContentSlot Section4Slot-KmCAHomepage is associated to ContentSlotForpage Section4-KmCAHomepage ].

ContentSlotName


 
                 PageTemplate àContentSlotForTemplateàContentSlot àCMSComponent

               Content/Category Page à ContentSlotForPage à ContentSlot à  CMSComponent

(7)    Create ContentSlotForPage and associate it to contentSlot [for ex: Section4Slot-kmCAHomepage].

Integration of CyberSource with Hybris Multi-channel suite 4.8 for Payment Gateway | Hybris 4.8 payment gateway integration

Cybersource is a leading provider of Credit Card Processing for Business. We have to use this for the credit card processing. Hybris provides this OOB itself. This document explains the steps to integrate with Cybersource using the API provided by Hybris.

Steps to integrate with Cybersource using Hybris API
1    Sign up for a test business login with Cybersource
Sign up for the test account with cybersource by going to Sign-up for a test account today
2    Preparing the cybersource extension
•    Credentials  Username: kmteststore and Password: test@123
•    Generate the security key by logging into the test account. There will be two options while selecting the security key. One is for SOAP Order API and the other for Simple Order API, Select Simple Order API to generate the key, because, hybris uses Simple Order API to interact with Cybersource.
•    Activate Hosted order page and Recurring Billing (by ticket in test merchant account)
•    While Creating the test account you will give the merchant ID. Now, name the generated security key as <merchantID>.p12
•    For sample of security key of merchantID KMteststore attached below

•    Rename the file /resources/cybs.properties.template to /resources/cybs.properties. Edit the file providing at least the value for "merchantID" property.
•    Copy this security file to the /config/security folder of Hybris server.
Dowload HOP.jsp page from Hosted Order page of cybersource site. Sample file attached below(Note this file is merchant dependent)
Enter new properties in config/local.properties. ############# Hosted Order Page settings #######################################################################
hop.post.url=https://orderpagetest.ic3.com/hop/orderform.jsp
# cybersource connectivity values
hop.cybersource.testCurrency=EUR
hop.cybersource.merchantID=KMteststore
##Below hop.cybersource.sharedSecret and hop.cybersource.serialNumber value should copy from HOP.jsp (Note -below value is for KMteststore merchantID)
hop.cybersource.sharedSecret=MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDL+8vfGDuJCFCaXTmxXKNizMAiHW90WK2XIwZOlURJoD4yCPzBjDbuD3CYdNz5l9iGnpPvm3Ad3jzTPKNC9s/C/yFP7cmrqNhOv3lnRvTTDIZtCJIBRvABlS4lXHR6In7dhnNSCaQmDbeRFk5P39dvAOncjIir8CBfDqKJPc0KNwIDAQAB
hop.cybersource.serialNumber=3431909238000176056165
hop.cybersource.testCurrency.KMStore=USD
######## CyberSource Hosted Order Page Properties
##### Appearance Configuration
### URL for an image to display in the background of the order page,
##  such as https://www.example.com/images/background.gif.
##  Note: Make sure to use a secure (HTTPS) URL so that your customers'
##  web browser does not display a security warning.
#hop.cybersource.appearance.backgroundImageURL.apparel-uk=

## Use one of these values:
##  - blue, standard (Gray), gray, green, orange, red, custom
## If you choose custom, the following four fields become required.
hop.cybersource.appearance.colorScheme=blue
hop.cybersource.appearance.colorScheme.KMStore=orange


## Enable these properties if you choose "custom" for [hop.cybersource.appearance.colorScheme].
hop.cybersource.appearance.barColor.KMStore=#37B837
hop.cybersource.appearance.barTextColor.KMStore=#FFFFFF
hop.cybersource.appearance.messageBoxBackgroundColor.KMStore=#BBF1BB
hop.cybersource.appearance.requiredFieldColor.KMStore=#000000
# PaymentInfo validates that the card number is plausible.
# Setting paymentinfo.creditcard.checknumber=false will prevent PaymentInfo.createItem()
# from throwing an exception if the card number is invalid.
paymentinfo.creditcard.checknumber=false
# Payment Service provider. "Cybersource" or "Mockup"
payment.service-provider.name=Cybersource

•    Now build the platform.

4. Cybersource Reason code and Reason text


    Below Decision, reason code and text send in response of cybersource

Decision     Reason Code                             Reason Text
ACCEPT        100, 110             Success
REVIEW         200, 201, 230, 520         Success
REJECT         102, 200, 202, 203, 204, 205,
207, 208, 210, 211, 221, 222, 230,
231, 232, 233, 234, 236, 240, 476      Failure
REJECT         475                 Payer Authentication
ERROR         150, 151, 152, 250         System error

5.Configuring the Hosted Order Page(Cybersource)

This section provides configure the default settings for the Hosted Order Page and downloading the security script.

Choosing Your Default Settings for the Hosted Order Page

This section is required for all users because the Hosted Order Page does not work unless you have chosen and saved your default settings once. Afterward, you can return to the settings page at any time to make changes if you wish.
(Note-To choose or modify the default settings, you must be an administrator user.)

•    In this section, you choose the colors and background image for the page, the fields to display to customers, and you add text to include on the order and receipt pages. Later, if you choose to do so, you can customize each section of the Hosted Order Page by adding to and modifying the HTML content of the page.
•    Log into the Business Center with your merchant user name and password.
•    Browse to Settings > HOP Settings.
•    Configure your default settings as needed. The settings page is divided into separate sections, which are detailed below:
i.    Data Entry Fields
ii.    Reply Management Fileds
iii.    Appearance Fields
iv.    Notification Fields
•    If you plan to use CyberSource’s hosted form, click View to preview the form and make changes to your settings if necessary.
•    When done, click Update. The Business Center saves your changes.

Integration of Google Analytics with Hybris multi-channel suite 4.8 | Hybris 4.8 tutorial



What is Google Analytics?
Google Analytics shows you how people found your site, how they explored it, and how you can enhance their visitor experience. With this information, you can improve your website return on investment, increase conversions, and make more money on the web.
How does Google Analytics work?
Google Analytics uses a first-party cookie and JavaScript code to collect information about visitors and to track your advertising campaign data. Google Analytics anonymously tracks how visitors interact with a website, including where they came from, what they did on a site, and whether they completed any of the site's conversion goals. Analytics also keeps track of your e-commerce data, and combines this with campaign and conversion information to provide insight into the performance of your advertising campaigns.
All of this information is presented in an easy-to-read, yet thorough manner, through intuitive, visual reports. Google Analytics won't affect the performance or the appearance of your website and there are no extra files to host on your website.
With information from Google Analytics, you will be able to drive traffic more efficiently to your site, and convert that traffic more effectively.

Google Account Dashboard











 Monitor activity as it happens on your site. So, you'll immediately see what's working, and what's not. Social Has Value 
 Which channels influenced your buyers?
  
Step 3.1 - Create a Google Analytics Account
To create an Analytics account:
2.     Enter your Google Account email and password and click Sign In. If you don't have a Google Account, click Sign up now to create one.
3.     Click Sign Up.
4.     Enter your Website's URL, making sure to select either http:// or https:// from the drop-down list. Enter a nickname for this account in the Account Name field, then click Continue.
5.     Enter your contact information and click Continue.
6.     Read the Google Analytics Terms of Service. If you agree to these terms, select the Yes checkbox and click Create New Account to continue.
The Tracking Instructions page that appears contains the tracking code that you'll need to paste into each page of your site or the header page of your site.

Step 3.2 - Configure Your Profile
It's important to configure your profile in order to get the most out of your reports. To access your profile settings:
1.     In the Website Profiles table, find the profile to edit.
2.     Click Edit. The Profile Settings page appears.
3.     Click Edit on the Main Website Profile Information table.
Default page
Setting this to the default (or index) page of your site allows Google Analytics to reconcile log entries for
www.example.com and www.example.com/index.html, for example. These are in fact the same page, but are reported as two distinct pages until the Default Page setting has been configured.
E-Commerce Website
To enable e-commerce reporting and the E-Commerce Analysis report set, select Yes.

Step 3.3 - Edit the Tracking Code for Custom Website Set-Ups
The tracking code that is provided to you is designed to work with most site setups. However, there are a few scenarios that require small updates to the tracking code on each of your pages. If any of the following apply to you, follow the instructions to update your code before adding it to your pages.
Learn how to:
1.     Track multiple domains in one profile (eg. a main site as well as a secure store site)
Step 3.4 - Add the Tracking Code to your Pages
Google Analytics only tracks pages that contain the Google Analytics tracking code. You'll need to add this code to each page of your site, either manually or through the use of includes or other methods.
Google analytics is already integrated in hybris accelerator we just need to make a entry in local.properties file
google.analytics.tracking.id=UA-33485702-1

To access your tracking code:
1.     Sign in to Google Analytics.
2.     From the Analytics Settings page, find the profile for which you would like to retrieve the tracking code. Please note that tracking code is profile-specific.
3.     From that profile's Settings column, click Edit.
4.     At the top right of the Main Website Profile Information box, click Check Status.
5.     Your tracking code can be copied and pasted from the text box in the Instructions for adding tracking section.
Basic installation
Copy and paste the code segment into the bottom of your content, immediately before the </body> tag of each page you are planning to track. If you use a common include or template, you can enter it there.
<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-xxxxxx-x]);
  _gaq.push(['_trackPageview']);

 (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
You'll need to update the "xxxx-x" in the sample above with your own Google Analytics account number. You can access your personalized tracking code in its entirety by following the instructions in Where can I find my tracking code?
Once you've completed this step, Google Analytics will begin collecting traffic data. You'll be able to see data in your reports within 24 hours.

Step 3.5 - Create Goals and Funnels
If your website is designed to drive visitors to a particular page, such as a purchase or email signup page, you can track the number of successful conversions using goals and funnels in Google Analytics.
  • A goal is a website page a visitor reaches once she or he has made a purchase or completed another desired action, such as a registration or download.
  • A funnel represents the path that you expect visitors to take in order to reach the goal. Defining these pages allows you to see how frequently visitors abandon goals (and where they go instead) and the value of the goal.
Each profile can have up to 4 goals, with a defined funnel for each. To set up goals and funnels:
Enter Goal Information:
1.     From the Analytics Settings page, find the profile for which you will be creating goals and click Edit.
2.     Select one of the four goal slots available for that profile and click Edit.
3.     Enter the Goal URL. Reaching this page marks a successful conversion. For example, a registration confirmation page, a checkout complete page, or a thank you page.
4.     Enter the Goal name as it should appear in your Google Analytics account.
5.     Turn the goal On or Off. This selection decides whether Google Analytics should track this conversion goal at this time. Generally, you'll want to set the Active Goal selection to On.
Then, Define a funnel by following these steps:
1.     Enter the URL of the first page of your conversion funnel. This page should be a page that is common to all users working their way towards your Goal. For example, if you are tracking user flow through your checkout pages, do not include a product page as a step in your funnel.
2.     Enter a Name for this step.
3.     If this step is a Required step in the conversion process, select the checkbox to the right of the step. If this checkbox is selected, users reaching your goal page without travelling through this funnel page will not be counted as conversions.
4.     Continue entering goal steps until your funnel has been completely defined. You may enter up to 10 steps, or as few as a single step.



Finally, configure Additional settings by following the steps below:
1.     If the URLs entered above are Case sensitive, select the checkbox.
2.     Enter a Goal value. This is the value used in Google Analytics' ROI calculations, and can be either a set value for the page, or a dynamic value pulled from your e-commerce receipt page. If the former, enter the amount in the field; if the latter, leave this field blank and refer to How do I track e-commerce transactions?
3.     Select a Match Type. There are three different Match Types you may select for your goal: Exact, Head, or Regular Expression.
a.     Exact Match: This option requires that the URLs entered as your funnel and goal URLs exactly match the URLs shown in the reports. For example, there can be no dynamic session identifiers or query parameters. Note: If you are using an exact match for a goal (i.e. http://domain.com/page.html), any trailing spaces will cause the goal to be invalid. If you are using partial matching (i.e. ^/page.html), trailing spaces are not an issue.
b.     Head Match: If your website has dynamically generated content, use the Head Match filter and leave out the unique values. For example, if the URL for a particular user is http://www.example.com/checkout.cgi?page=1&id=9982251615 but the id varies for every other user, enter http://www.example.com/checkout.cgi?page=1 and select Head Match as your match type.
c.     Regular Expression Match: This option uses regular expressions to match your URLs. This is useful when the stem, trailing parameters, or both can vary between users. For example, if a user could be coming from one of many subdomains, and your URLs use session identifiers, use regular expressions to define the constant element of your URL. For example, page=1 will match "http://sports.example.com/checkout.cgi?page=1&id=002" as well as "http://fishing.example.com/checkout.cgi?page=1&language=fr&id119."
d.     Click Save Changes to create this Goal and funnel, or Cancel to exit without saving.

Please see the following articles for more information on setting up goals:
Google Analytics provides the ability to add any number of users to your account, and to grant varying levels of access to your reports..
Granting profile access
To allow access to another user, follow the instructions below. Please note that additional users will need to create a free Google Account in order to be granted access.
1.     Click Access Manager.
2.     Click Add.
3.     Enter the user's email address, last name, and first name.
4.     Select the Access type for this user: View reports only, or Account Administrator, which allows the user to edit account settings.
5.     If you selected View reports only, select the profiles to which this user should have access (note that Account Admins have access to all profiles). Reports for profiles that are not selected will not be available to this user.
6.     Click Add to move these profiles into the Selected Website Profiles list.
7.     Click Finish to create the new user.

Step 3.6 - Enable e-Commerce Transaction Tracking
With some simple additions to your receipt page, Google Analytics can automatically detect and record transaction and product information. The required information is placed into a hidden form which is parsed for transaction and product information. Most template driven e-commerce systems can be modified to include this information in the receipt.
You'll also need to enable e-commerce reporting for your website's profile:
  • From the Analytics Settings page, click Edit next to the profile you would like to enable.
  • Click Edit from the Main Website Profile Information box
  • Change the E-commerce Website radio button from No to Yes.
Writing the required information
Somewhere in the receipt, below the tracking code, the following lines need to be written by your engine. Everything in brackets should be replaced by actual values, as described in
How do I track e-commerce transactions?