Edit Future-Imperfect Theme HTML?
Hello!
I've recently installed Bludit on my website and I'm loving it so far!
I've been tinkering with the CSS and have managed to integrate it fairly cohesively into my website (I'm using the Future Imperfect theme). One thing I want to do however, is edit the HTML on the index pages and post pages so that it can have the links I want in the navbar and have them be the same as the rest of the website, as well as removing the company logo section and a couple of other minor things like that.
Where do I access this HTML code? I can clearly see these sections in developer tools when I view the page source, but I can't find the page to edit in my theme and bludit directory.
Any help from you guys would be greatly appreciated.
I've recently installed Bludit on my website and I'm loving it so far!
I've been tinkering with the CSS and have managed to integrate it fairly cohesively into my website (I'm using the Future Imperfect theme). One thing I want to do however, is edit the HTML on the index pages and post pages so that it can have the links I want in the navbar and have them be the same as the rest of the website, as well as removing the company logo section and a couple of other minor things like that.
Where do I access this HTML code? I can clearly see these sections in developer tools when I view the page source, but I can't find the page to edit in my theme and bludit directory.
Any help from you guys would be greatly appreciated.
- Edi
- Site Admin
- Posts: 3121
- Joined: Sun Aug 09, 2015 5:01 pm
- Location: Zurich
- Has thanked: 54 times
- Been thanked: 77 times
- Contact:
An explanation of the theme structure can be found in the theme section of the documentation:
http://docs.bludit.com
The index template for example is
/themes/future-imperfect/index.php
The post template is
/themes/future-imperfect/php/post.php
Everything can be modified. But please respect the license:
http://html5up.net/license
Hope this helps. Otherwise, please ask.
http://docs.bludit.com
The index template for example is
/themes/future-imperfect/index.php
The post template is
/themes/future-imperfect/php/post.php
Everything can be modified. But please respect the license:
http://html5up.net/license
Hope this helps. Otherwise, please ask.
Clickwork - Websites mit Bludit | Planet Bludit - Tipps und Snippets
Hello and thank you for the response. I'll be sure to the respect the license when I'm making changes to the template.Edi wrote:An explanation of the theme structure can be found in the theme section of the documentation:
http://docs.bludit.com
The index template for example is
/themes/future-imperfect/index.php
The post template is
/themes/future-imperfect/php/post.php
Everything can be modified. But please respect the license:
http://html5up.net/license
Hope this helps. Otherwise, please ask.
The code I want to view is the code I get when I "view page source" in my internet browser. It looks like this:
Code: Select all
<!--
Future Imperfect by HTML5 UP
html5up.net | @n33co
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
Bludit CMS
bludit.com | @bludit
MIT license
-->
<html>
<head>
<!-- Include HTML meta tags -->
<base href="/bludit/themes/future-imperfect/">
<title>Impressify.co</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css">
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
<link rel="stylesheet" href="assets/css/bludit.css">
</head>
<body>
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<h1><a href="http://impressify.co/bludit/">Impressify.co</a></h1>
<nav class="links">
<ul>
<li><a href="/bludit/http-impressifyco-abouthtml">About</a></li> </ul>
</nav>
<nav class="main">
<ul>
<li class="menu"><a class="fa-bars" href="#menu">Menu</a></li>
</ul>
</nav>
</header>
<!-- Menu -->
<section id="menu">
<!-- Links -->
<section>
<ul class="links">
<li><a href="/bludit/http-impressifyco-abouthtml">
<h3>About</h3>
<p>About your site or yourself</p>
</a></li> </ul>
</section>
<!-- Actions -->
<section>
<ul class="actions vertical">
<li><a href="http://impressify.co/bludit/admin/" class="button big fit">Log in</a></li>
</ul>
</section>
</section>
<!-- Main -->
<div id="main">
<article class="post">
<!-- Plugins Post Begin -->
<!-- Post's header -->
<header>
<div class="title">
<h2><a href="/bludit/post/this-is-a-test">This is a test</a></h2>
<p></p>
</div>
<div class="meta">
<time class="published" datetime="2015-11-01">November 24, 2015</time>
<a href="#" class="author"><span class="name">Administrator </span><img src="/bludit/content/uploads/profiles/admin.jpg" alt=""></a>
</div>
</header>
<!-- Post's content, the first part if has pagebrake -->
<p>test</p>
<!-- Post's footer -->
<footer>
<!-- Read more button -->
<!-- Post's tags -->
<ul class="stats">
</ul>
</footer>
<!-- Plugins Post End -->
</article>
<article class="post">
<!-- Plugins Post Begin -->
<!-- Post's header -->
<header>
<div class="title">
<h2><a href="/bludit/post/dssfdsdfsdf">dssfdsdfsdf</a></h2>
<p></p>
</div>
<div class="meta">
<time class="published" datetime="2015-11-01">November 24, 2015</time>
<a href="#" class="author"><span class="name">Administrator </span><img src="/bludit/content/uploads/profiles/admin.jpg" alt=""></a>
</div>
</header>
<!-- Post's content, the first part if has pagebrake -->
<p>sdfsdfsdfsdfsdfsdfsdf</p>
<!-- Post's footer -->
<footer>
<!-- Read more button -->
<!-- Post's tags -->
<ul class="stats">
</ul>
</footer>
<!-- Plugins Post End -->
</article>
<article class="post">
<!-- Plugins Post Begin -->
<!-- Post's header -->
<header>
<div class="title">
<h2><a href="/bludit/post/first-post">First post</a></h2>
<p>Welcome to Bludit</p>
</div>
<div class="meta">
<time class="published" datetime="2015-11-01">November 24, 2015</time>
<a href="#" class="author"><span class="name">Administrator </span><img src="/bludit/content/uploads/profiles/admin.jpg" alt=""></a>
</div>
</header>
<!-- Post's content, the first part if has pagebrake -->
<h2>What's Next</h2>
<ul>
<li>Manage your Bludit from the <a href="./admin/">admin area</a></li>
<li>Follow Bludit on <a href="https://twitter.com/bludit">Twitter</a> / <a href="https://www.facebook.com/bluditcms">Facebook</a> / <a href="https://plus.google.com/+Bluditcms">Google+</a></li>
<li>Chat with developers and users on <a href="https://gitter.im/dignajar/bludit">Gitter</a></li>
<li>Visit the <a href="http://forum.bludit.com">forum</a> for support</li>
<li>Read the <a href="http://docs.bludit.com">documentation</a> for more information</li>
<li>Share with your friends and enjoy</li>
</ul>
<!-- Post's footer -->
<footer>
<!-- Read more button -->
<!-- Post's tags -->
<ul class="stats">
<li><a href="/bludit/tag/bludit">Bludit</a></li><li><a href="/bludit/tag/cms">CMS</a></li><li><a href="/bludit/tag/flat-files">Flat files</a></li> </ul>
</footer>
<!-- Plugins Post End -->
</article>
<!-- Pagination -->
<ul class="actions pagination">
</ul>
</div>
<!-- Sidebar -->
<section id="sidebar">
<!-- Intro -->
<section id="intro">
<a href="http://impressify.co/bludit/" class="logo"><img src="images/logo.jpg" alt=""></a>
<header>
<h2>Impressify.co</h2>
<p></p>
</header>
</section>
<div class="plugin plugin-pages"><h2>Pages</h2><div class="plugin-content"><ul><li><a class="parent active" href="/bludit/">Home</a></li><li><a class="parent " href="/bludit/http-impressifyco-abouthtml">About</a></li></ul></div></div><div class="plugin plugin-tags"><h2>Tags</h2><div class="plugin-content"><ul><li><a href="/bludit/tag/bludit">Bludit (1)</a></li><li><a href="/bludit/tag/cms">CMS (1)</a></li><li><a href="/bludit/tag/flat-files">Flat files (1)</a></li></ul></div></div>
<!-- Footer -->
<section id="footer">
<p class="copyright">Impressify Copyright © 2015 | Design: <a href="http://html5up.net">HTML5 UP</a></p>
</section> </section>
</div>
<!-- Scripts -->
<script src="/bludit/kernel/admin/themes/default/js/jquery.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
<script src="assets/js/main.js"></script>
</body>
</html>
When I go to themes/future-imperfect/php/post.php the code I get is this:
Code: Select all
<article class="post">
<!-- Plugins Post Begin -->
<?php Theme::plugins('postBegin') ?>
<!-- Post's header -->
<header>
<div class="title">
<h2><a href="<?php echo $Post->permalink() ?>"><?php echo $Post->title() ?></a></h2>
<p><?php echo $Post->description() ?></p>
</div>
<div class="meta">
<?php
// Author
$author = $Post->username();
if( Text::isNotEmpty($Post->authorFirstName()) || Text::isNotEmpty($Post->authorLastName()) ) {
$author = $Post->authorFirstName().' '.$Post->authorLastName();
}
?>
<time class="published" datetime="2015-11-01"><?php echo $Post->date() ?></time>
<a href="#" class="author"><span class="name"><?php echo $author ?></span><img src="<?php echo $Post->profilePicture() ?>" alt=""></a>
</div>
</header>
<!-- Post's content, the first part if has pagebrake -->
<?php echo $Post->content() ?>
<!-- Post's footer -->
<footer>
<!-- Post's tags -->
<ul class="stats">
<?php
$tags = $Post->tags(true);
foreach($tags as $tagKey=>$tagName) {
echo '<li><a href="'.HTML_PATH_ROOT.$Url->filters('tag').'/'.$tagKey.'">'.$tagName.'</a></li>';
}
?>
</ul>
</footer>
<!-- Plugins Post End -->
<?php Theme::plugins('postEnd') ?>
</article>
Thanks again for your help, any answer is greatly appreciated.
- Edi
- Site Admin
- Posts: 3121
- Joined: Sun Aug 09, 2015 5:01 pm
- Location: Zurich
- Has thanked: 54 times
- Been thanked: 77 times
- Contact:
The file post.php is the template with HTML and variables to show posts.ndumanov wrote: None of the HTML is there for me to edit in the post.php file.
For example:
Code: Select all
<time class="published" datetime="2015-11-01"><?php echo $Post->date() ?></time>
Code: Select all
<time class="published" datetime="2015-11-01">November 24, 2015</time>
Clickwork - Websites mit Bludit | Planet Bludit - Tipps und Snippets
Hello,kaaleth wrote:What would you like to change?
I would like to change the navigation bar to have exactly the same links as the rest of my website (impressify.co) and I would like to remove the left hand menu (logo, pages, tags) entirely. That's pretty much it.
The link to my blog is http://impressify.co/bludit/
- Edi
- Site Admin
- Posts: 3121
- Joined: Sun Aug 09, 2015 5:01 pm
- Location: Zurich
- Has thanked: 54 times
- Been thanked: 77 times
- Contact:
I do not really understand what you mean... The navigation at "Pages" in the left sidebar? If you publish a page also a navigation link is created.ndumanov wrote: I would like to change the navigation bar to have exactly the same links as the rest of my website (impressify.co) [...]
Or can you please give an example.
Clickwork - Websites mit Bludit | Planet Bludit - Tipps und Snippets
Edi wrote:I do not really understand what you mean... The navigation at "Pages" in the left sidebar? If you publish a page also a navigation link is created.ndumanov wrote: I would like to change the navigation bar to have exactly the same links as the rest of my website (impressify.co) [...]
Or can you please give an example.
The navigation bar at the very top of the blog (http://www.impressify.co/bludit) is what I want to change to match my website (http://www.impressify.co). It's easier to understand if you visit the links, you'll see exactly what I'm talking about. The fixed navbar at the top.
I want to eliminate the left sidebar altogether.
So... Are you going to integrate Bludit with your website, right?
Try this simple version that I made as a port for Bludit:
https://onedrive.live.com/redir?resid=C ... file%2czip
Download and upload Alpha folder to your bludit/themes.
And remember: this is early version. Some things were missed.
Try this simple version that I made as a port for Bludit:
https://onedrive.live.com/redir?resid=C ... file%2czip
Download and upload Alpha folder to your bludit/themes.
And remember: this is early version. Some things were missed.