Включить панель навигации HTML во всех страницах

У меня есть панель навигации, которую я хочу иметь в отдельном html-файле, а затем использовать на всех моих других страницах. Я чувствую, что это сделает код более аккуратным и более организованным. Однако у меня проблемы. Я начал пытаться исправить главную страницу, и это то, что у меня есть:Включить панель навигации HTML во всех страницах

<!DOCTYPE html> 
<html> 
<head> 
    <title>Home Page</title> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    <link rel="import" href="navigation.html"> 


    </head> 

<body> 



<br><br> 
<div class="zoom pic"> 
<center> <img src="images/technology.png" alt="portrait"> <center> 
</div> 


</body> 

</html>

Это навигационная панель в отдельном HTML файле, но в том же самом точном каталоге, как и все другие мои HTML-файлов.

Это navigation.html файл, если он помогает ничего:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Home Page</title> 
    <link rel="stylesheet" type="text/css" href="style.css"> 

</head> 



<center> <b>World Congress CS-IT Conferences 2016</center> 
<div id="horizontalmenu"> 
    <ul> 
    <li><a href="index.html" title="Home Page">Home<br/></a></li> 
    <ul> <li><a href="information.html">General Information</a> <ul> 
     <li><a href="about.html">About</a></li> 
     <li><a href="fee.html"> Conference Fee</a></li> 
     <li><a href="hotel.html">Hotel</a></li> </ul> 
    <li><a href="keynote.html" title="Speakers">Keynote Speakers<br/></a></li> 
    <li><a href="call.html" title="Call for Papers">Call for Papers<br/></a></li> 
    <li><a href="dates.html" title="Important Dates">Important Dates<br/></a></li> 
    <li><a href="major.html" title="Major Areas">Major Areas<br/></a></li> 
    <li><a href="paper.html" title="Submit a Paper">Paper Submission<br/></a></li> 
    <li><a href="reviewer.html" title="Login">Login<br/></a></li> 
    <li><a href="register.html" title="Register online">Registration<br/></a></li> 
    <li><a href="conference.html" title="Conference">Conference Program<br/></a></li> 
    <li><a href="guidelines.html" title="Guidelines">Guidelines<br/></a></li> 
    <li><a href="comments.html" title="Comments and Feedback">Comments<br/></a></li> 
    </ul> 
</nav></b>

Мой текущий вопрос в том, что я не вижу навигационную панель сейчас в моей домашней странице! Любые идеи о том, как справиться с этим? Любая помощь очень ценится !!!!

источник

2015-10-24 Vortex11

вам понадобятся PHP, SSI или JQuery Ajax, звонки –

, или вы можете использовать язык шаблонов и использовать что-то вроде посредника или jekyll для размещения, чтобы вы могли использовать частичные. Проверьте эту ссылку: https://middlemanapp.com/basics/partials/ – luke

PHP поможет вам в этом.

Сохраните свой навигационный штрих-код в файле navbar.php и включите этот файл на страницу, на которой вы хотите панель навигации. Например, если вы хотите включить панель навигации в файл index.php, вы можете просто включить ее так.

Вам нужен сервер для запуска php-кода. Вы не можете напрямую включать HTML-файл в другой файл HTML.

источник

2015-10-24 19:42:24

Хорошо, я попробую это. У меня есть apachne, проходящий через XAMPP. Где в моем html-файле я помещаю эту строку? – Vortex11

Тогда он работает отлично. –

Возможно, вам придется изменить свой home.html на home.php, чтобы PHP запустил вышеуказанный код на вашей домашней странице –

Это можно сделать также с помощью jQuery. здесь вы пишете нагигационные бары html в navigationBar.html и в зависимости от того, на какую страницу вы хотите включить его, создайте пустой элемент с id #nav и в скрипте замените его содержимое.

$.get("navigationBar.html", function(data){ 
    $("#nav").replaceWith(data); 
});

это также может быть сделано с помощью импорта html5 тег http://blog.teamtreehouse.com/introduction-html-imports

Проверить эту ссылку, если и хотят.

источник

2017-10-23 06:05:14

Включить панель навигации HTML во всех страницах

ответ

Смежные вопросы