1. Add Bootstrap module. 
  2. To add the page editor to a DG3 application simply add the module pageeditor to the application.
  3. Then add a table with the name PageDef as described in the documentation for the module.
  4. Add templates for inline editor and normal (named ckinline and bootstrapbase). 
  5. Rebuild the application and try one of the editors added by using urltoapp/pagedit/
  6. Start the DEServer and add the DG3 application to it
  7. Rebuild the application from DEServer
  8. Open the page you created with the url /depage/nameyougavethepage/

The templates needed by pageeditor

<!DOCTYPE html>

<html>
<head>
{% block extra-head %}{% endblock %}
	<link rel="stylesheet" href="{{ media_url }}css/style.css" />
	<title>{% block title %}{% endblock %}</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<!-- Bootstrap -->
	<link href="{{ media_url }}bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
	<script charset="utf-8" type="text/javascript" src="{{ media_url }}js/jquery.min.js"></script>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script charset="utf-8" type="text/javascript"  src="{{ media_url }}bootstrap/js/bootstrap.min.js"></script>
	<script charset="utf-8" type="text/javascript"  src="{{ media_url }}js/ckeditor/ckeditor.js"></script>
{% block extra-head-bottom %}{% endblock %}
</head>

<body>
<div class="container">
{% block content %}
{% endblock %}
</div>
</body>
</html>

ckinline (exclude ckeditor and jquerycore)

<!DOCTYPE html>

<html>
<head>
{% block extra-head %}{% endblock %}
	<link rel="stylesheet" href="{{ media_url }}css/style.css" />
	<title>{% block title %}{% endblock %}</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<!-- Bootstrap -->
	<link href="{{ media_url }}bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
	<script charset="utf-8" type="text/javascript" src="{{ media_url }}js/jquery.min.js"></script>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script src="{{ media_url }}bootstrap/js/bootstrap.min.js"></script>
{% block extra-head-bottom %}{% endblock %}
</head>

<body>
<div class="container">
{% block content %}
{% endblock %}
</div>
</body>
</html>

bootstrapbase (exclude jquerycore)