How to use “Term of Use” in Popup

I want to customize the term of use in popup, when a user login for first time that page should appear in popup.

2 Answers

Answers 1

To set the terms of use you will need to do 2 things.

First you'll need to create a Web Content Article.

1. Go to the Control Panel.
2. Select "Web Content".
3. Then Add > "Basic Content".
4. Enter in your desired Terms of Use language.
5. Write down the ID and the Group ID you've created the content.

Note: The ID is available when you're viewing the content's page but the group ID is less obvious. To find the group ID, look at the URL, and find the parameter doAsGroupId. Its value is the group ID you've created the article for.

Secondly, you'll need to configure your portal to load this Web Content article.

1. From the file system, navigate to your Liferay Portal installation.
2. From there find the portal.properties file. If you're using Tomcat, it will be located in webapps\ROOT\WEB-INF\classes.
3. Here add a file named portlet-ext.properties, if it does not already exist.

4. Add the following keys with the values you previously wrote down.

   terms.of.use.journal.article.group.id= terms.of.use.journal.article.id= 

Restart your server and the portal should now display the Terms of Use form the Web Content article.

Answers 2

You can make use of modal dialog in bootstrap through which u can achieve what you want.

$(window).load(function() { $('#newModal').modal('show'); }); 

Don't forget to add this style sheets import in your html file.

<link rel="stylesheet"href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">    </script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 

Your html file should have the following code

<div class="container"> <!-- Modal --> <div class="modal fade" id="myModal" role="dialog"> <div class="modal-dialog">    <!-- Modal content-->  <div class="modal-content">     <div class="modal-header">       <!Your Heading-->     </div>   <div class="modal-body">       <p>Your text in the modal.</p>   </div>   <div class="modal-footer">       <button type="button" class="btn btn-default" data-dismiss="modal">I Agree</button>    </div> 

If You Enjoyed This, Take 5 Seconds To Share It

• Facebook
• Twitter
• Google+
• StumbleUpon
• Digg
• Delicious
• LinkedIn
• Reddit
• Technorati