*edit:
I'm working with Single Page Aplication, and by using "ui-route" I manage to go threw my different HTML pages without loading new pages.
So I dont need to include the main page code in every other page.
I hope my question is more understandable now.
I have this main page:
but when I go to another page I want the logo and the menu apear but not the quote
Here is the main page code:
<body>
<div style="text-align: center">
<img alt="adminPhoto" src="../Img/admin.png" width="300px"
height="300px">
</div>
<ul>
<li><img alt="Main" src="../Ico/main.png"></li>
<li><a href="#/manageCompanies"><img alt="Manage Companies"
src="../Ico/companies.png"></a></li>
<li><a href="#/manageCustomers"><img alt="Manage Customers"
src="../Ico/customers.png"></a></li>
</ul>
<div ui-view></div>
<div>
<blockquote style="margin-left: 30%;">
Welcome Admin!<br /> We welcome you to try out most convenient Admin
experience.<br /> Designed with the most advanced tools.<br /> Update,
Delete or Create your Companies and Customers - with only one click!<br />
<footer>
<cite>Daniel Liverant</cite>
</footer>
</blockquote>
</div>
</body>
What way I should try?
create a header.php or header .html file. In there paste your menu and logo. Then include the page on each other html file.
example below:
Header.php
<!-- File 1 header.php -->
<img src=".."/>
<nav>
<ul>
<li>
</ul>
</nav>
Content file
<?php
include "header.php";
?>
<blockqoute> <!-- or not? -->
Hope this helps!
The include (or require) statement takes all the text/code/markup that exists in the specified file and copies it into the file that uses the include statement.
Including files is very useful when you want to include the same PHP, HTML, or text on multiple pages of a website.
For PHP create two files:
header.php
<body>
<div style="text-align: center">
<img alt="adminPhoto" src="../Img/admin.png" width="300px"
height="300px">
</div>
<ul>
<li><img alt="Main" src="../Ico/main.png"></li>
<li><a href="#/manageCompanies"><img alt="Manage Companies"
src="../Ico/companies.png"></a></li>
<li><a href="#/manageCustomers"><img alt="Manage Customers"
src="../Ico/customers.png"></a></li>
</ul>
<div ui-view></div>
index.php
<?php include 'header.php';?>
<div>
<blockquote style="margin-left: 30%;">
Welcome Admin!<br /> We welcome you to try out most convenient Admin
experience.<br /> Designed with the most advanced tools.<br /> Update,
Delete or Create your Companies and Customers - with only one click!<br />
<footer>
<cite>Daniel Liverant</cite>
</footer>
</blockquote>
</div>
</body>
You can include header.php anywhere in your website.
All I had to do is to insert the quoate code inside the
<div ui-view> -code- </div>
and that's all.
Related
I am trying to display the image from the file path but it's seeing a different thing entirely, I'm vague of what to do. I am using dropzone. The images are stored in this directory laravel/public/gallery/images. so the url is thus: http://localhost:port/gallery/images. The images are saved in the db successfully but displaying them is an issue. This is the code to display:
<TR><TD>
<DIV class="row">
<DIV class="col-md-12">
<DIV id="gallery-images">
<ul>
#foreach($productVerificationValidation->productDocumentUpload as $productDocument)
<li>
<a href="{{url($productDocument->file_path)}}./.{{$productDocument->file_name}}" target="_blank">
<img src="{{url($productDocument->file_path)}}">
</a>
</li>
#endforeach
</ul>
</DIV>
</DIV>
</DIV>
</TD></TR>
This is the controller to display the view:
public function viewUploadedDocuments($id=null){
$productVerificationValidation = ProductVerificationValidation::findOrFail($id);
return view('product.verification-validation.viewDocuments')->with('productVerificationValidation', $productVerificationValidation);
}
To my surprise when i check the console on Chrome, instead of getting the properties of the images it returns wrong properties as displayed on the screenshot:
but the db record has a different property as displayed on the screenshot:
what wrong am I to make right, Please help out.
Thanks guys, I got it working by appending the file name to it thus:
<DIV class="row">
<DIV class="col-md-12">
<DIV id="gallery-images">
<ul>
#foreach($productVerificationValidation->productDocumentUpload as $productDocument)
<li>
<a href="{{url($productDocument->file_path .'/'. $productDocument->file_name)}}" target="_blank">
<img src="{{ url($productDocument->file_path .'/'. $productDocument->file_name) }}" />
</a>
</li>
#endforeach
</ul>
</DIV>
</DIV>
</DIV>
newbie self learning web design. In theory, I've learned html and css. In practice I've hit a snag. Here is the barebones code so far.
<header>
<a id="site-logo" href="/"><img src="#" alt="Dot Design" /></a>
<nav>
<ul>
<li>Home</li>
<li>About</li>
<li>Services</li>
<li>Portfolio</li>
<li>Contact</li>
</ul>
</nav>
<form id="search">
<input type="search" placeholder="Search" />
</form>
</header>
<div id="content>
<!-- content goes here -->
</div>
Here is the template I'm referencing for practice: http://min.us/i/braxZb11KQjfD
The problem is I'm not quite sure if:
everything in the red box should go in the header
only the jquery slider should go in the header
everything in the red box should not be in the header
or it doesn't matter and just a matter of preference
Since I have no experience, I'd like some feedback as to which method is correct? Or more generally accepted and preferred?
Thank you very much for your input.
Everything in the red box should not be in the header unless that content describes the page content. Which at this point it does't look like it does. It's just homepage content. Unless the intro is directly related to the slider there's no reason to combine the two.
<header></header>
<div id="content">
<figure class="hero"></figure>
<p class="lead"></p>
...
</div>
Would work fine as a setup. The HTML offers a way to group elements semantically (for instance the section and header) or to provide hooks for styling (#content and .hero etc).
Page name is experts.asp. I want to use a jump to go though a long list of people and have the h1 element of their name at the top of the window. I've tested jumps and they work fine on HTML pages not on my asp page. Please help me to do this..
My code is here..
<ul class="experts">
<li>Sami</li>
<li>Michael</li>
<li>Greg</li>
<li>David</li>
<li>Tom</li>
<li>Gaston</li>
<li>Matt</li>
<li>Dennis</li>
<li>Michelle</li>
<li>Maria</li>
<li class="last">Greg</li>
</ul>
And here is one of the sections I want jumped to:
<h1 name="michael">Michael</h1> <img src="..." alt="Michael " class="expert">
<p></p>
Use the id attribute instead of name.
<h1 id="michael">Michael</h1> <img src="..." alt="Michael " class="expert">
<p></p>
I'm not sure if this is really the best method, but I've only been working with joomla for two days so am very inexperienced.
Basically I have an html container in my template that holds a carousel extension and a set of images. The container has a blue background in contract to the white of the rest of the website.
I basically want to toggle that container with the extension on different pages. Here's my code:
<div id="top">
<div id="photos">
<jdoc:include type="modules" name="carousel" />
</div>
<div id="social_media">
<a id="success" href="#">Read about our success stories</a>
<a id="partner" href="#">Be a partner</a>
<a id="facebook" href="#">Join us on Facebook</a>
</div>
</div>
What I want to do is make this entire chunk of code into a Custom HTML module that only display on certain pages.
I've attempted to do this but the extension for the carousel doesn't show up, nor the jdoc:include part. I'm guessing this is because Joomlas text editor doesn't interpret jdoc:includes the same way the joomla engine does.
Is there any way around this?
In order to load a module within an article (or a Custom HTML module) you want to use the loadposition command. Here is what it would look like in your case:
<div id="top">
<div id="photos">
{loadposition carousel}
</div>
<div id="social_media">
<a id="success" href="#">Read about our success stories</a>
<a id="partner" href="#">Be a partner</a>
<a id="facebook" href="#">Join us on Facebook</a>
</div>
</div>
Ok the topic I asked here is about "anchor" is that correct?
Ok this actually works now
**Development** this is on the First Site
And then where the Development is: (2nd site)
<a name="#tips1">**Developer**</a>
Did I miss something here?
Ok this is this first site:
http://i197.photobucket.com/albums/aa253/tintingerri/Test/test-4.png
Now if you can see, if you click on the "Development" it will go to the 2nd site. And in this 2nd site, this is where I listed the "Development" and "Consulting" in one page.
Now I would like that if the user click on "Consulting" it would go directly to the "Consulting" text and not to "Development" text first because they are written in one page.
So is this anchor?
I'm not sure I understand what you mean.
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grapes</li>
</ul>
<hr />
<p id="apple">This is the Apple section.</p>
<hr />
<p id="banana">This is the Banana section.</p>
<hr />
<p id="grapes">This is the Grapes section.</p>
When you click on a link, it will take you to the section it's linked with via element IDs. The sections can be behind the <hr />.
Linking to another page is similar:
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grapes</li>
</ul>
Is this what you meant?
[EDIT]
After clearing the issue in the comments, the solution indeed turns out to be anchors. Page one, say, index.html, will have this code:
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grapes</li>
</ul>
While page two, say, fruit.html, will have this code:
<p id="apple">This is the Apple section.</p>
<hr />
<p id="banana">This is the Banana section.</p>
<hr />
<p id="grapes">This is the Grapes section.</p>
You don't have to use <p> tags, of course. You'll probably want to use <div> containers instead:
<div id="apple">
<p>My apple stuff</p>
</div>
<hr />
etc.
I'm really not sure what you're asking here, but I get the impression it's along the lines of:
If someone clicks the links, how do I show information related to that link on the same page?
Which is relatively easy:
html:
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grapes</li>
</ul>
<div id="apple" class="panel">
<p>Apple Stuff</p>
</div>
<div id="banana" class="panel">
<p>Banana Stuff</p>
</div>
<div id="grapes" class="panel">
<p>Grapes Stuff</p>
</div>
css:
.panel {
display: none;
}
.panel:target {
display: block;
}
JS Fiddle demo of the above.
I think you are trying to link to another place on your page?
For absolute, the following syntax is used: Link text.
With relative addressing, it is only necessary to use the name of the web page file you are linking to as the value in the href attribute provided that the page containing the link resides in the same folder as the page acting as the link's target.
Maybe still this doesnt answer your question?
For the same page, A named anchor inside an HTML document:
<a name="useful on same page">Useful Paragraph</a>
Create a link to the "Useful Paragraph" inside the same document:
Useful Paragraph
If I still havent answered the question, please provide more info
With an ul, very simple:
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grapes</li>
</ul>