How to display session login in header html template?

I have a several template contain :

  1. Header
  2. Content
  3. Footer
  4. Menu

And how could i display session in header html template

Hey @baskara8,

Are you asking specifically how to pass data to a template in Go, or rather how to specifically pass session data in?,

I’m asking because it would work the same way when passing regular or session specific information in to the template, for example when calling ExecuteTemplate:

t.ExecuteTempate(w, "index.html", sessionInfo)

Edit: If you don’t actually know how to pass info to a template, you can check out some of the examples I have over here: https://github.com/radovskyb/go-packages/tree/master/html/template.

The package docs (https://golang.org/pkg/html/template/) should also have examples for passing data to a template.

Edit 2: If you are actually unsure how to use sessions with Go, you could check out something like the gorilla/sessions package which is pretty good for session handling: http://www.gorillatoolkit.org/pkg/sessions.

Hey @radovskyb,

I want to pass session data, i have set session id({{.UserID}}) after login successfully,
and i have define header and footer that include for each dynamic content.

{{define “header”}}
<!doctype html>

<title>Light Bootstrap Dashboard by Creative Tim</title>

<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<meta name="viewport" content="width=device-width" />


<!-- Bootstrap core CSS     -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />

<!-- Animation library for notifications   -->
<link href="assets/css/animate.min.css" rel="stylesheet"/>

<!--  Light Bootstrap Table core CSS    -->
<link href="assets/css/light-bootstrap-dashboard.css" rel="stylesheet"/>


<!--  CSS for Demo Purpose, don't include it in your project     -->
<link href="assets/css/demo.css" rel="stylesheet" />


<!--     Fonts and icons     -->
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Roboto:400,700,300' rel='stylesheet' type='text/css'>
<link href="assets/css/pe-icon-7-stroke.css" rel="stylesheet" />
<!--

    Tip 1: you can change the color of the sidebar using: data-color="blue | azure | green | orange | red | purple"
    Tip 2: you can also add an image using data-image tag

-->

	<div class="sidebar-wrapper">
        <div class="logo">
            <a href="http://www.creative-tim.com" class="simple-text">
                Creative Tim
            </a>
        </div>

        <ul class="nav">
            <li class="active">
                <a href="dashboard.html">
                    <i class="pe-7s-graph"></i>
                    <p>Dashboard</p>
                </a>
            </li>
            <li>
                <a href="user.html">
                    <i class="pe-7s-user"></i>
                    <p>User Profile</p>
                </a>
            </li>
            <li>
                <a href="table.html">
                    <i class="pe-7s-note2"></i>
                    <p>Table List</p>
                </a>
            </li>
            <li>
                <a href="typography.html">
                    <i class="pe-7s-news-paper"></i>
                    <p>Typography</p>
                </a>
            </li>
            <li>
                <a href="icons.html">
                    <i class="pe-7s-science"></i>
                    <p>Icons</p>
                </a>
            </li>
            <li>
                <a href="maps.html">
                    <i class="pe-7s-map-marker"></i>
                    <p>Maps</p>
                </a>
            </li>
            <li>
                <a href="notifications.html">
                    <i class="pe-7s-bell"></i>
                    <p>Notifications</p>
                </a>
            </li>
			<li class="active-pro">
                <a href="upgrade.html">
                    <i class="pe-7s-rocket"></i>
                    <p>Upgrade to PRO</p>
                </a>
            </li>
        </ul>
	</div>
</div>

<div class="main-panel">
    <nav class="navbar navbar-default navbar-fixed">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navigation-example-2">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">Dashboard</a>
            </div>
            <div class="collapse navbar-collapse">
                <ul class="nav navbar-nav navbar-left">
                    <li>
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                            <i class="fa fa-dashboard"></i>
                        </a>
                    </li>
                    <li class="dropdown">
                          <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="fa fa-globe"></i>
                                <b class="caret"></b>
                                <span class="notification">5</span>
                          </a>
                          <ul class="dropdown-menu">
                            <li><a href="#">Notification 1</a></li>
                            <li><a href="#">Notification 2</a></li>
                            <li><a href="#">Notification 3</a></li>
                            <li><a href="#">Notification 4</a></li>
                            <li><a href="#">Another notification</a></li>
                          </ul>
                    </li>
                    <li>
                       <a href="">
                            <i class="fa fa-search"></i>
                        </a>
                    </li>
                </ul>

                <ul class="nav navbar-nav navbar-right">
                    <li>
                       <a href="#">
                           {{.UserID}}
                        </a>
                    </li>
                    <li class="dropdown">
                          <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                Dropdown
                                <b class="caret"></b>
                          </a>
                          <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something</a></li>
                            <li class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                          </ul>
                    </li>
                    <li>
                        <a href="apiLogout" onclick="return confirm('Logout?')">
                            Log out
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
    {{end}}

{{ define “home” }}
{{template “header”}}







Email {{.UserID}}


Last Campaign Performance




                            <div class="footer">
                                <div class="legend">
                                    <i class="fa fa-circle text-info"></i> Open
                                    <i class="fa fa-circle text-danger"></i> Bounce
                                    <i class="fa fa-circle text-warning"></i> Unsubscribe
                                </div>
                                <hr>
                                <div class="stats">
                                    <i class="fa fa-clock-o"></i> Campaign sent 2 days ago
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-8">
                    <div class="card">
                        <div class="header">
                            <h4 class="title">Users Behavior</h4>
                            <p class="category">24 Hours performance</p>
                        </div>
                        <div class="content">
                            <div id="chartHours" class="ct-chart"></div>
                            <div class="footer">
                                <div class="legend">
                                    <i class="fa fa-circle text-info"></i> Open
                                    <i class="fa fa-circle text-danger"></i> Click
                                    <i class="fa fa-circle text-warning"></i> Click Second Time
                                </div>
                                <hr>
                                <div class="stats">
                                    <i class="fa fa-history"></i> Updated 3 minutes ago
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>



            <div class="row">
                <div class="col-md-6">
                    <div class="card ">
                        <div class="header">
                            <h4 class="title">2014 Sales</h4>
                            <p class="category">All products including Taxes</p>
                        </div>
                        <div class="content">
                            <div id="chartActivity" class="ct-chart"></div>

                            <div class="footer">
                                <div class="legend">
                                    <i class="fa fa-circle text-info"></i> Tesla Model S
                                    <i class="fa fa-circle text-danger"></i> BMW 5 Series
                                </div>
                                <hr>
                                <div class="stats">
                                    <i class="fa fa-check"></i> Data information certified
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-6">
                    <div class="card ">
                        <div class="header">
                            <h4 class="title">Tasks</h4>
                            <p class="category">Backend development</p>
                        </div>
                        <div class="content">
                            <div class="table-full-width">
                                <table class="table">
                                    <tbody>
                                        <tr>
                                            <td>
                                                <label class="checkbox">
                                                    <input type="checkbox" value="" data-toggle="checkbox">
                                                </label>
                                            </td>
                                            <td>Sign contract for "What are conference organizers afraid of?"</td>
                                            <td class="td-actions text-right">
                                                <button type="button" rel="tooltip" title="Edit Task" class="btn btn-info btn-simple btn-xs">
                                                    <i class="fa fa-edit"></i>
                                                </button>
                                                <button type="button" rel="tooltip" title="Remove" class="btn btn-danger btn-simple btn-xs">
                                                    <i class="fa fa-times"></i>
                                                </button>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <label class="checkbox">
                                                    <input type="checkbox" value="" data-toggle="checkbox" checked="">
                                                </label>
                                            </td>
                                            <td>Lines From Great Russian Literature? Or E-mails From My Boss?</td>
                                            <td class="td-actions text-right">
                                                <button type="button" rel="tooltip" title="Edit Task" class="btn btn-info btn-simple btn-xs">
                                                    <i class="fa fa-edit"></i>
                                                </button>
                                                <button type="button" rel="tooltip" title="Remove" class="btn btn-danger btn-simple btn-xs">
                                                    <i class="fa fa-times"></i>
                                                </button>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                <label class="checkbox">
                                                    <input type="checkbox" value="" data-toggle="checkbox" checked="">
                                                </label>
                                            </td>
                                            <td>Flooded: One year later, assessing what was lost and what was found when a ravaging rain swept through metro Detroit
Create 4 Invisible User Experiences you Never Knew About Read "Following makes Medium better" Unfollow 5 enemies from twitter
                            <div class="footer">
                                <hr>
                                <div class="stats">
                                    <i class="fa fa-history"></i> Updated 3 minutes ago
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{{template "footer"}}

{{ end }}}

Hey again @baskara8,

Once again I’m not too sure exactly what you are having trouble with here since you haven’t actually posted what you’ve tried on the Go side of things, but here’s a small example how you can pass a user id to a template. In this case I’m just executing the template to stdout, but of course it’s all the same to execute it to a response writer:

package main

import (
	"html/template"
	"log"
	"os"
)

var tmplSrc = `{{.UserID}}`

type SessionData struct {
	UserID string
}

func main() {
	t, err := template.New("tmpl").Parse(tmplSrc)
	if err != nil {
		log.Fatalln(err)
	}

	sessionInfo := &SessionData{
		UserID: "radovskyb", // Set info here.
	}

	// Pass to template here.
	if err := t.Execute(os.Stdout, sessionInfo); err != nil {
		log.Fatalln(err)
	}
}

If you haven’t actually learnt about using templates or building web apps in Go yet, I suggest you start with a tutorial like the following: https://golang.org/doc/articles/wiki/.

Hi @radovskyb,

Thanks for your reply, for this case i have found solution, when i read your sample in your github,
but i have a question, it is possible in golang, if template html become dynamic from url ?
for example like this :
localhost/home?pages=dashboard -> it call dashboard pages
localhost/home?pages=user -> it call user pages

that changes only div content in html

Of course, you can definitely do that with Go.

It would look something like this:

package main

import (
	"html/template"
	"log"
	"net/http"
)

var tmpls = template.Must(template.New("tmpls").ParseFiles("dashboard.html", "user.html"))

func pageHandler(w http.ResponseWriter, r *http.Request) {
	page := r.FormValue("pages")

	switch page {
	case "dashboard":
		if err := tmpls.ExecuteTemplate(w, "dashboard.html", nil); err != nil {
			http.Error(w, err.Error(), http.StatusInternalServerError)
		}
	case "user":
		if err := tmpls.ExecuteTemplate(w, "user.html", nil); err != nil {
			http.Error(w, err.Error(), http.StatusInternalServerError)
		}
	default:
		http.Error(w, "template not found", http.StatusInternalServerError)
	}
}

func main() {
	http.HandleFunc("/home", pageHandler)
	log.Fatal(http.ListenAndServe(":9000", nil))
}

However, I feel like you are trying to write PHP style code in Go with that. I would personally be using something like the following instead.

http://localhost:9000/user goes to user template.
http://localhost:9000/dashboard goes to dashboard template.

The above can be achieved very easily with code like the following:

package main

import (
	"html/template"
	"log"
	"net/http"
)

var tmpls = template.Must(template.New("tmpls").ParseFiles("dashboard.html", "user.html"))

func dashboardHandler(w http.ResponseWriter, r *http.Request) {
	if err := tmpls.ExecuteTemplate(w, "dashboard.html", nil); err != nil {
		http.Error(w, err.Error(), http.StatusInternalServerError)
	}
}

func userHandler(w http.ResponseWriter, r *http.Request) {
	if err := tmpls.ExecuteTemplate(w, "user.html", nil); err != nil {
		http.Error(w, err.Error(), http.StatusInternalServerError)
	}
}

func main() {
	http.HandleFunc("/dashboard", dashboardHandler)
	http.HandleFunc("/user", userHandler)
	log.Fatal(http.ListenAndServe(":9000", nil))
}

Edit: With the above example, the 2 templates could easily be made to inherit a structure from a single template, which even though I didn’t show in the above example, it’s not too hard to figure out if you learn about templates. There might even be an example for inherited templates in the examples I sent you but can’t remember.

Lastly, I really feel like you should spend some time reading over some of the basic web application building tutorials with Go, especially the ones that use templates, but of course, do whatever works best for you :slight_smile:

1 Like

Hi @radovskyb,

Thanks for your explanation,

Actually i have too long learn PHP Code, so it sometimes still brings approach PHP Code in My Golang Code… :slight_smile:

Once again thanks

1 Like

No worries, anytime! :smiley:

Hi @radovskyb,

What a difference between parsefiles and parseglob? and which one is better if want to develop dynamic website?

Hey @baskara8,

Neither is better or worse, it just depends on what you are after.

For example, if you want to parse every single html template file in a directory without thinking about it, you might template.ParseGlob("*.html"), where if you only want to parse specific html files, you might use template.ParseFiles("index.html", "about.html") etc.

Realistically, as the docs state, calling ParseGlob is equivalent to calling ParseFiles with the list of files matched by the pattern.

One other thing, what’s your definition of dynamic website in this case? :slight_smile:

Is there any different in memory uses between parseglob and parsefiles?

Dynamic here is i mean i can passing data from database or variable inside html

Why include template html in golang cannot read passing data? i take a example from your go-packages/html/template/parsefiles, i try to add title value -> {{define “header”}} {{.Title}} HEADER TEMPLATE{{end}}, but when i run main.go {{.Title}} is …

is it different between template in golang and include in php?

About the memory usage question, there would definitely be some increase in memory usage when using ParseGlob since it has to search first for the files matching the pattern, where with ParseFiles you are specifying exactly which files you want.

I’m not exactly sure what you are asking in that second question, could you possibly rephrase it a little bit? :slight_smile:

For memory is answered thanks :slight_smile:

My second question is, why in golang template like {{template “header”}} cannot pass data {{.Title}} in {{define “header”}}{{.Title}}HEADER TEMPLATE{{end}}, the result is HEADER TEMPLATE so why cannot pass text Index Page likes in {{.Title}} in indexTemplate…

Im usually using function include in php, is there any equal include php function in golang?

I’m not too sure what you mean, since you can pass the title in, but in the example you are talking about, you would need to pass it in like the following:

indexTmplData := struct {
	Title string
}{
	Title: "Index Page",
} 

err = templates.ExecuteTemplate(os.Stdout, "indexTemplate.html", indexTmplData)
if err != nil {
	log.Fatalln(err)
}

Also, with PHP, I’m not sure if you are trying to include sub templates or in this case, more PHP code. You have to remember that PHP directly embeds HTML with it’s code. What I’m getting at, is that you can use sub templates in Go if that’s what you want to do and you can also use import "pkgname" to import other Go packages as well.

You should definitely read up on how it works if you haven’t yet.

Hi @radovskyb,

Herewith i attached function in .go

func user(w http.ResponseWriter,r *http.Request){
session := sessions.Start(w, r)
var UserID = session.GetString(“UserID”)
var data = make(map[string]string)
data[“UserID”] = UserID
t, err := template.ParseFiles(“template/base.html”, “template/user.html”)
if err != nil {
log.Fatal(err)
}
if err := t.Execute(w, data); err != nil {
log.Fatal(err)
}
}

so when i write {{.UserID}} in template/base.html file it visible but when i write {{.UserID}} in template/user.html it invisible

Since I can’t see the whole code here I’ll just take a guess.

Rather than using this:

if err := t.Execute(w, data); err != nil {
    log.Fatal(err)
}

For calling the user template, use this:

if err := t.ExecuteTemplate(w, "user.html", data); err != nil {
    log.Fatal(err)
}

Hi @radovskyb,

I want to parse multiple files html herewith my files

func user(w http.ResponseWriter,r *http.Request){
session := sessions.Start(w, r)
var UserID = session.GetString(“UserID”)
var data = make(map[string]string)
data[“UserID”] = UserID
t, err := template.ParseFiles(“template/base.html”, “template/user.html”)
if err != nil {
log.Fatal(err)
}

template/base.html

{{ if eq .UserID “”}}

{{else}}

{{ template "title" }}
<!-- Bootstrap core CSS     -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />
<!-- Animation library for notifications   -->
<link href="assets/css/animate.min.css" rel="stylesheet"/>
<!--  Light Bootstrap Table core CSS    -->
<link href="assets/css/light-bootstrap-dashboard.css" rel="stylesheet"/>
<!--  CSS for Demo Purpose, don't include it in your project     -->
<link href="assets/css/demo.css" rel="stylesheet" />
<!--     Fonts and icons     -->
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Roboto:400,700,300' rel='stylesheet' type='text/css'>
<link href="assets/css/pe-icon-7-stroke.css" rel="stylesheet" />
<div class="main-panel">
    <nav class="navbar navbar-default navbar-fixed">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navigation-example-2">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">Dashboard</a>
            </div>
            <div class="collapse navbar-collapse">
                <ul class="nav navbar-nav navbar-left">
                    <li>
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                            <i class="fa fa-dashboard"></i>
                        </a>
                    </li>
                    <li class="dropdown">
                          <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="fa fa-globe"></i>
                                <b class="caret"></b>
                                <span class="notification">5</span>
                          </a>
                          <ul class="dropdown-menu">
                            <li><a href="#">Notification 1</a></li>
                            <li><a href="#">Notification 2</a></li>
                            <li><a href="#">Notification 3</a></li>
                            <li><a href="#">Notification 4</a></li>
                            <li><a href="#">Another notification</a></li>
                          </ul>
                    </li>
                    <li>
                       <a href="javascript:;" >
                            <i class="fa fa-search"></i>
                        </a>
                    </li>
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li>
                       <a href="javascript:;">
                           {{.UserID}}
                        </a>
                    </li>
                    <li class="dropdown">
                          <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                Dropdown
                                <b class="caret"></b>
                          </a>
                          <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something</a></li>
                            <li class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                          </ul>
                    </li>
                    <li>
                        <a href="apiLogout" onclick="return confirm('Logout?')">
                            Log out
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </nav>
{{template "content"}}
<footer class="footer">
        <div class="container-fluid">
            <nav class="pull-left">
                <ul>
                    <li>
                        <a href="#">
                            Home
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Company
                        </a>
                    </li>
                    <li>
                        <a href="#">
                            Portfolio
                        </a>
                    </li>
                    <li>
                        <a href="#">
                           Blog
                        </a>
                    </li>
                </ul>
            </nav>
            <p class="copyright pull-right">
                &copy; 2016 <a href="http://www.creative-tim.com">Creative Tim</a>, made with love for a better web
            </p>
        </div>
    </footer>
</div>
<!--  Checkbox, Radio & Switch Plugins -->
<script src="assets/js/bootstrap-checkbox-radio-switch.js"></script>
<!--  Charts Plugin -->
<script src="assets/js/chartist.min.js"></script>
<!--  Notifications Plugin    -->
<script src="assets/js/bootstrap-notify.js"></script>
<!--  Google Maps Plugin    -->
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<!-- Light Bootstrap Table Core javascript and methods for Demo purpose -->
<script src="assets/js/light-bootstrap-dashboard.js"></script>
<!-- Light Bootstrap Table DEMO methods, don't include it in your project! -->
<script src="assets/js/demo.js"></script>
<script src="assets/js/my.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        demo.initChartist();
        $.notify({
            icon: 'pe-7s-gift',
            message: "Welcome to <b>Light Bootstrap Dashboard</b> - a beautiful freebie for every web developer."
        },{
            type: 'info',
            timer: 4000
        });
    });
</script>
{{end}}

template/user.html

{{define “title”}}User Profile{{end}}
{{define “content”}}

Edit Profile {{.UserID}}

Company (disabled)
Username
Email address
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>First Name</label>
                                            <input type="text" class="form-control" placeholder="Company" value="Mike">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label>Last Name</label>
                                            <input type="text" class="form-control" placeholder="Last Name" value="Andrew">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <label>Address</label>
                                            <input type="text" class="form-control" placeholder="Home Address" value="Bld Mihail Kogalniceanu, nr. 8 Bl 1, Sc 1, Ap 09">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label>City</label>
                                            <input type="text" class="form-control" placeholder="City" value="Mike">
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label>Country</label>
                                            <input type="text" class="form-control" placeholder="Country" value="Andrew">
                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="form-group">
                                            <label>Postal Code</label>
                                            <input type="number" class="form-control" placeholder="ZIP Code">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <label>About Me</label>
                                            <textarea rows="5" class="form-control" placeholder="Here can be your description" value="Mike">Lamborghini Mercy, Your chick she so thirsty, I'm in that two seat Lambo.</textarea>
                                        </div>
                                    </div>
                                </div>
                                <button type="submit" class="btn btn-info btn-fill pull-right">Update Profile</button>
                                <div class="clearfix"></div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card card-user">
                        <div class="image">
                            <img src="https://ununsplash.imgix.net/photo-1431578500526-4d9613015464?fit=crop&fm=jpg&h=300&q=75&w=400" alt="..."/>
                        </div>
                        <div class="content">
                            <div class="author">
                                 <a href="javascript:;" id="btn-modal-detailuser">
                                <img class="avatar border-gray" src="assets/img/faces/face-3.jpg" alt="..."/>
                                  <h4 class="title">Mike Andrew<br />
                                     <small>michael24</small>
                                  </h4>
                                </a>
                            </div>
                            <p class="description text-center"> "Lamborghini Mercy <br>
                                                Your chick she so thirsty <br>
                                                I'm in that two seat Lambo"
                            </p>
                        </div>
                        <hr>
                        <div class="text-center">
                            <button href="#" class="btn btn-simple"><i class="fa fa-facebook-square"></i></button>
                            <button href="#" class="btn btn-simple"><i class="fa fa-twitter"></i></button>
                            <button href="#" class="btn btn-simple"><i class="fa fa-google-plus-square"></i></button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="modal right fade" id="modal-detailuser" data-keyboard="false" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel2">Right Sidebar</h4>
            </div>
            <div class="modal-body">
                <p>Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
                </p>
            </div>
        </div><!-- modal-content -->
    </div><!-- modal-dialog -->
 </div><!-- modal -->

{{end}}

I’m sorry, I really don’t understand the current question…

It really does seem to me know that you should be looking for some basic tutorials on templates as opposed to asking all of your questions here to do with the basics.

Please have a look at something like the following: https://astaxie.gitbooks.io/build-web-application-with-golang/content/en/07.4.html#nested-templates, or even just use Google to search for your questions, because it’s not very hard to find resources to learn about this stuff.

If you actually invest in the time to learn from these tutorials rather than asking very similar questions, you will actually learn much faster.

Lastly, please try to format your code accordingly in the future by indenting by 4 spaces after pasting the code in here, since it’s quite difficult to read through otherwise.

1 Like

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.