We have moved our forum to GitHub Discussions. For questions about Phalcon v3/v4/v5 you can visit here and for Phalcon v6 here.

how to use BootStrap theme in a Phalcon Project??

Hellou everybody!!! So, how to use bootstrap theme in a Phalcon Project?? I am begginer in Phalcon PHP, and in MVC too. I'll tried to make it, but, not was good :(

if you know some site that talk about the subject, post the link in here. thank you!



33.8k

Bootstrap? You mean https://www.getbootstrap.com/ ?

Like always: put it in your public folder (separating CSS and JS into properly folders), and just add link and script, nothing else. Later, on their URL/SRC, write /css/... or /js/... (if your have set your project root in /).

edited Aug '14

Yes it is! I'm having problems. for example: when I access controller ( https://project.my/controller ), the bootstrap template works, but, when I access an action ( https://project.my/controller/action ) the bootstrap template is broken! I'm missing somewhere.

Other question! In app/view/index.volt, I have the code: {{ content() }}
how can I make others, ex {{ menu() }} or {{ footer() }} ???

edited Aug '14

I think you need to set up a base template

view/base.volt:

<html>
<head>
bootstrap js and css goes here
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>

view/index/index.volt:

{% extends "base.volt" %}

{% block content %}
<div>information</div>
{% endblock %}

Now you should be able to see how to add a footer, your menu can stay in the base.volt unless you have variable menus.

Please see inheritance: https://docs.phalcon.io/en/latest/reference/volt.html#multiple-inheritance



33.8k

For {{ content() }} I've no idea 'cause I haven't worked with Volt yet. But for the <link> and <script> ones, let's take an example.

Imagine you have a public folder. That is your virtual host root. Now, if you use views (don't know if for templates will be the same), you have to set your CSS and JS below the root you defined below. Now you just put your root, followed by css/... or js/....