MyBB Community Forums

PD: My english is not very good, I use google translator

Hello here family, I need your advice and your help, I'm on the case...

(Well I'm Cuban, for starters) .. Soon I'll start a project, and I wanted to start using bootstrap, which in fact its library is amazing and phenomenal, I've seen and downloaded a few themes and because it's responsive, I imagine they use some of this. But my case is the following, as I am going to start my project I have studied this program a bit and I want to start doing my work using the MyBB default template, I wanted to know if it is necessary or where to put the following code:

Note_1: I know that many will tell me that I should go to the beginning of the template, but since I should modify it without affecting the rest,

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap demo</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
  </head>
  <body>
    <h1>Hello, world!</h1>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
  </body>
</html>

For the case above, I have the following questions:

1. How should I use it?
2. Where would the same go?
3. How do you modify that?

I have watched several Bootstrap videos and on the official page, I don't know if links are allowed, but I want you to understand my case a little:

https://getbootstrap.com/docs/5.2/gettin...roduction/

Here I have looked at many things that I would like to implement to start testing the modification that I want to make to the MyBB Default template, and many things are useful for my project, but the problem is that I do not know where to locate the code exposed above, to be able to make use of it, and give a new vision to my project, to try it out and it is good to know your opinions... Thank you in advance....

PS: If there is any other doubt regarding the topic, I would like the administration not to close this topic to continue posting doubts here and not create so many topics, if possible.

Family, thank you for your attention... I await your answers...

PD: At the moment my site is local, because I don't have a server now, but I would like to learn at home to get a vision of what I am doing.

Put your Bootstrap .css file in your {$headerinclude} template, and place your Bootstrap .js file at the very end of your {$footer} template.

To understand... this code that I am going to put is the {$headerinclude}:

<link rel="alternate" type="application/rss+xml" title="{$lang->latest_threads} (RSS 2.0)" href="{$mybb->settings['bburl']}/syndication.php" />
<link rel="alternate" type="application/atom+xml" title="{$lang->latest_threads} (Atom 1.0)" href="{$mybb->settings['bburl']}/syndication.php?type=atom1.0" />
<meta http-equiv="Content-Type" content="text/html; charset={$charset}" />
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript" src="{$mybb->asset_url}/jscripts/jquery.js?ver=1823"></script>
<script type="text/javascript" src="{$mybb->asset_url}/jscripts/jquery.plugins.min.js?ver=1821"></script>
<script type="text/javascript" src="{$mybb->asset_url}/jscripts/general.js?ver=1827"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">




{$stylesheets}
<script type="text/javascript">
<!--
	lang.unknown_error = "{$lang->unknown_error}";
	lang.confirm_title = "{$lang->confirm_title}";
	lang.expcol_collapse = "{$lang->expcol_collapse}";
	lang.expcol_expand = "{$lang->expcol_expand}";
	lang.select2_match = "{$lang->select2_match}";
	lang.select2_matches = "{$lang->select2_matches}";
	lang.select2_nomatches = "{$lang->select2_nomatches}";
	lang.select2_inputtooshort_single = "{$lang->select2_inputtooshort_single}";
	lang.select2_inputtooshort_plural = "{$lang->select2_inputtooshort_plural}";
	lang.select2_inputtoolong_single = "{$lang->select2_inputtoolong_single}";
	lang.select2_inputtoolong_plural = "{$lang->select2_inputtoolong_plural}";
	lang.select2_selectiontoobig_single = "{$lang->select2_selectiontoobig_single}";
	lang.select2_selectiontoobig_plural = "{$lang->select2_selectiontoobig_plural}";
	lang.select2_loadmore = "{$lang->select2_loadmore}";
	lang.select2_searching = "{$lang->select2_searching}";

	var templates = {
		modal: '{$jsTemplates['modal']}',
		modal_button: '{$jsTemplates['modal_button']}'
	};

	var cookieDomain = "{$mybb->settings['cookiedomain']}";
	var cookiePath = "{$mybb->settings['cookiepath']}";
	var cookiePrefix = "{$mybb->settings['cookieprefix']}";
	var cookieSecureFlag = "{$mybb->settings['cookiesecureflag']}";
	var deleteevent_confirm = "{$lang->deleteevent_confirm}";
	var removeattach_confirm = "{$lang->removeattach_confirm}";
	var loading_text = '{$lang->ajax_loading}';
	var saving_changes = '{$lang->saving_changes}';
	var use_xmlhttprequest = "{$mybb->settings['use_xmlhttprequest']}";
	var my_post_key = "{$mybb->post_code}";
	var rootpath = "{$mybb->settings['bburl']}";
	var imagepath = "{$theme['imgdir']}";
  	var yes_confirm = "{$lang->yes}";
	var no_confirm = "{$lang->no}";
	var MyBBEditor = null;
	var spinner_image = "{$theme['imgdir']}/spinner.gif";
	var spinner = "<img src='" + spinner_image +"' alt='' />";
	var modal_zindex = 9999;
// -->
</script>

I guess it should be like this, of course if the code label that is inside... I put it like this to guide me more or less!!

<debugstuff>
	</div>
</div>
<div id="footer">
	<div class="upper">
		<div class="wrapper">
			{$lang_select}
			{$theme_select}
			<ul class="menu bottom_links">
				{$showteamlink}
				{$contact_us}
				<li><a href="{$mybb->settings['homeurl']}">{$mybb->settings['homename']}</a></li>
				<li><a href="#top">{$lang->bottomlinks_returntop}</a></li>
				<li><a href="<archive_url>">{$lang->bottomlinks_litemode}</a></li>
				<li><a href="{$mybb->settings['bburl']}/misc.php?action=markread{$post_code_string}">{$lang->bottomlinks_markread}</a></li>
				<li><a href="{$mybb->settings['bburl']}/misc.php?action=syndication">{$lang->bottomlinks_syndication}</a></li>
			</ul>
		</div>
	</div>
	<div class="lower">
		<div class="wrapper">
			<span id="current_time">{$lang->welcome_current_time}</span>
			<span id="copyright">
				<!-- MyBB is free software developed and maintained by a volunteer community.
					It would be much appreciated by the MyBB Group if you left the full copyright and "powered by" notice intact,
					to show your support for MyBB.  If you choose to remove or modify the copyright below,
					you may be refused support on the MyBB Community Forums.

					This is free software, support us and we'll support you. -->
				{$lang->powered_by} <a href="https://mybb.com" target="_blank" rel="noopener">MyBB{$mybbversion}</a>, &copy; 2002-{$copy_year} <a href="https://mybb.com" target="_blank" rel="noopener">MyBB Group</a>.
				<!-- End powered by -->
			</span>
		</div>
	</div>
</div>
<!-- The following piece of code allows MyBB to run scheduled tasks. DO NOT REMOVE -->{$task_image}<!-- End task image code -->
{$auto_dst_detection}
</div>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>

Forgetting about the code labels that are inside those, I imagine it should look like this

Yep! That's correct.

ARESKY

MattyWjeisz

ARESKY

MattyWjeisz