I have a problem with the way Wordpress creates code.
My posts should be wrapped inside a div but Wordpress creates a few extra <a> wraps and I don't know how to get rid of them.
Does anyone has an idea?
My code below.
<article #php(post_class(mainpagepost))>
<div class="entry-center">
<header class="entry-header">
<div class="entry-header-subinfo">
#php(the_category()) | #php(the_date())
</div>
<h2 class="entry-title">{{ get_the_title() }}</h2>
</header>
<div class="entry-summary">
#php(the_excerpt())
</div>
<button type="button" class="btn btn-default"><a href="{{ get_permalink() }}">READ MORE</button>
</div>
#php(the_post_thumbnail(entry-image))
</article>
It adds these lines of code over them.
</a></div><a href="//localhost:3000/Git/VoiceBooking%20Blog/wordpress/index.php/2017/12/13/welcome-to-this-blog/">
This part in the code represents a link to the complete post:
<a href="{{ get_permalink() }}">
(plus the closing </a> tag for each of these.)
So if you remove those, you can get rid of those links. However, be aware that they lead to the full post - the code you posted above only will display part of the port (the excerpt), so you need some way to get users to see the full post. The way it's done in the code in your question is really quite common and is what people are used to.
ADDITION: Actually there is a closing </a> tag missing in your code, on this line:
<button type="button" class="btn btn-default"><a href="{{ get_permalink() }}">READ MORE</button>
That should be
<button type="button" class="btn btn-default">READ MORE</button>
That probably causes some trouble in the HTML output when Wordpress or the browser tries to correct that incomplete link...
Related
I am new to Laravel and I have been trying to display partial children view on top of parent view using hyperlink. But nothing happens when I click on my hyperlink. on the other hand it is working on normal button.
Here is the code that works without any problem on normal button.
<button type="button" id="close_register" title="{{ __('cash_register.close_register') }}" class='button-custom' data-container=".close_register_modal"
data-href="{{ action('CashRegisterController#getCloseRegister')}}">
<!-- <strong><i class="fa fa-window-close fa-lg"></i></strong> -->
</button>
And here is the hyperlink based button code.
<a id="close_register" data-container=".close_register_modal"
data-href="{{ action('CashRegisterController#getCloseRegister')}}" class='glowBtn'>Day Close
</a>
Any help would be highly appreciated Thanks in advance.
Actually this is not a Laravel problem, but a simple HTML one. Your tag is missing an HREF attribute. Use javascript:void(0);, if you want to avoid reloading the page unexpectedly.
<a
id="close_register"
data-container=".close_register_modal"
data-href="{{ action('CashRegisterController#getCloseRegister')}}"
href="javascript:void(0);"
class='glowBtn'>Day Close
</a>
ISSUE RESOLVED:
The issue was related to the path of script calling js. Original script:
````<script src="js/app.js" charset="utf-8"></script>````
Working script:
````<script src="/js/app.js" charset="utf-8"></script>````
The / missing at the beginning was working on initially loaded pages as you navigate deeper into the site it gets thrown off.
I am using the bootstrap accordion with cards to present data to users. When the page was first created as a static page the accordion worked. As soon as I called data to it the accordions lost functionality and can't be opened or collapsed. They stay in the position they are in. Inspecting the webpage shows all the code present but something is blocking the "collapse" function. This is also true of the aria-expanded class. Choosing "true" / "false" have no effect on the class functionality.
I have created a new file, copy and pasted the code into it without the DB calls and verified that it works so it appears the issue is related directly to the PHP calls, the first being:
{{ $department->name }}
The other interesting thing is that after deleting (tried commenting out as well) the DB calls, the page still will not function properly. However, the page where I have not done any data calls but am re-using the same HTML works.
Department.blade.php
<div class="container">
<center><h1 id="">{{ $department->name }}</h1></center>
//Second location data is being called
<center><h1 class="top-space">Mission Statement</h1></center>
<!-- Dynamically allow users with permission to change the mission statement -->
<p id="">{{ $department->mission_statement }}</div>
//Accordion HTML
<div id="accordion">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
News and Events
</button>
</h5>
</div>
<!-- This should fill with an index view of the department's news and events. OnClick navigate the user to that record in view (layout.single.NandE.blade.php). Control loaded data on-page, only load Card Titles, NandE first. The rest of the card's content should load on a delay to improve user experience -->
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
</div>
</div>
</div>
Test.blade.php (File where accordion works)
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
News and Events
</button>
</h5>
</div>
<!-- This should fill with an index view of the department's news and events. OnClick navigate the user to that record in view (layout.single.NandE.blade.php). Control loaded data on-page, only load Card Titles, NandE first. The rest of the card's content should load on a delay to improve user experience -->
<div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
<div class="card-body">
<ul>
<li>
:
</li>
</ul>
</div>
</div>
</div>
The desired behavior is that when the Department.blade.php file is called the first accordion with news and events is openly displaying the events. On click of the accordion, it should collapse.
Bootstrap's docs say:
Using the card component, you can extend the default collapse behavior to create an accordion. To properly achieve the accordion style, be sure to use .accordion as a wrapper.
Try changing this:
//Accordion HTML
<div id="accordion">
To this:
//Accordion HTML
<div class="accordion">
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
CLARIFICATION: Being that I've never used PHP, it was unclear how to format the PHP file, so that when you include it in the index, then header(nav bar) would show up. No posts explained why I had to change my index.html to index.php to make it work. And again, being that I haven't used PHP, I was under the impression that changing the extension meant that I would have to convert my HTML code to PHP commands. I was trying to avoid having to change my whole code around. That's where the confusion was.
I was going to delete the question once I got it figured out. Then again, I'm sure I'm not the only person that may run into this while making their first website.
SOLUTION. Save only the nav code in html language with a PHP extension (header.php). Change index/home file from .html to a .php extension (don't have to modify any code. but accepts the include prompt). Then, include the header.php in your index.php. Same goes for your footer. Thanks for the help everyone.
*ORIGINAL POST: Through another post, I was told it would be easier to use a nav/footer on multiple pages by using PHP.
I created a file and tried including it and it is not displaying. I'm not sure what I am doing wrong.
There is some CSS in my nav bar as well, do I need to import the css file in the PHP file? or does the index.html file automatically attach to the included (php) file.
PHP Code:
<?php
echo '<nav>
<div>
<a href="/">
<div id="logo"><img src="/Images/7serviceLOGOblue2.png" alt="Home"/></div>
<div id="headtag"><img src="/Images/title.png" alt="Home"/></div>
<div id="tagline"><img src="/Images/tag_line.png" alt="Home"/></div>
</a>
</div>
<div>
Home
<a href="/about.html" >About</a>
<a href="/services.html" >Services</a>
<a href="/pricing.html" >Pricing</a>
<a href="/contact.html" >Contact Us</a>
<input id="srchbar" type="search" placeholder="Search">
</div>
</nav>';
?>
HTML Code (include):
<body>
<?php include '/header.php';?>
....other code....
</body>
If there's a problem with the PHP file, if I'm missing something, can someone show an explain please?
no need to add <?php ?> code in the header file just keep it as it is :
Create a new file named header.php and add this code to it
<nav>
<div>
<a href="/">
<div id="logo"><img src="/Images/7serviceLOGOblue2.png" alt="Home"/></div>
<div id="headtag"><img src="/Images/title.png" alt="Home"/></div>
<div id="tagline"><img src="/Images/tag_line.png" alt="Home"/></div>
</a>
</div>
<div>
Home
<a href="/about.html" >About</a>
<a href="/services.html" >Services</a>
<a href="/pricing.html" >Pricing</a>
<a href="/contact.html" >Contact Us</a>
<input id="srchbar" type="search" placeholder="Search">
</div>
Include header.php anywhere you want
Remove the <?php tag from your code. As you generated html output. <?php tags are used to generate output by php.
<nav>
<div>
<a href="/">
<div id="logo"><img src="/Images/7serviceLOGOblue2.png" alt="Home"/></div>
<div id="headtag"><img src="/Images/title.png" alt="Home"/></div>
<div id="tagline"><img src="/Images/tag_line.png" alt="Home"/></div>
</a>
</div>
<div>
Home
<a href="/about.html" >About</a>
<a href="/services.html" >Services</a>
<a href="/pricing.html" >Pricing</a>
<a href="/contact.html" >Contact Us</a>
<input id="srchbar" type="search" placeholder="Search">
</div>
</nav>
If you want to use php tags, than you have to write the code in this way:
<?php
echo '
<nav>
<div>
<a href="/">
<div id="logo"><img src="/Images/7serviceLOGOblue2.png" alt="Home"/></div>
<div id="headtag"><img src="/Images/title.png" alt="Home"/></div>
<div id="tagline"><img src="/Images/tag_line.png" alt="Home"/></div>
</a>
</div>
<div>
Home
<a href="/about.html" >About</a>
<a href="/services.html" >Services</a>
<a href="/pricing.html" >Pricing</a>
<a href="/contact.html" >Contact Us</a>
<input id="srchbar" type="search" placeholder="Search">
</div>
</nav>
';
?>
Your problem is most likely the pathing of you include. Often you'd need to specify from the server root, and not just /header.php.
To specify your including-path, you could specify the root like this
include $_SERVER['DOCUMENT_ROOT']."/header.php";
You can also set the default include path in your php.ini file, thus making the $_SERVER['DOCUMENT_ROOT'] an automatic process, that can be done with running this code, that will alter your php.ini file.
ini_set('include_path', '/usr/lib/pear');
As others have pointed out, you don't need the contents of your /header.php to be echoed out as it's pure HTML. Anything that's included will be included the way it is, so having the contents of /header.php as pure HTML just makes for better practice, as it's easier to read.
I am making an attempt to write my own theme for wordpress and have written a file that contains all my modals (twitter bootstrap), which are html. I added that to the theme section (created an inc folder) and named it modals.php.
I included that via php everywhere in the page where I need the modals. This works. Whenever I click on the link, the modal loads. However, when I start adding php to the modals, it breaks. My modal is being loaded, but instead of the requested post item from the wordpress database (i use that to make it dynamic content, since its multi language), it loads the footer, and breaks my website, which is confusing me really.
my modals.php contains the following
<div id="about" class="modal fade" tabindex="-1">
<div class="vertical-alignment-helper">
<div class="modal-dialog vertical-align-center">
<div class="modal-content">
<div class="modal-header">
<button class="close" type="button" data-dismiss="modal"></button>
<button class="close" type="button" data-dismiss="modal">x<span class="sr-only">Close</span></button>
<h4 id="myModalLabel" class="modal-title">
My modal popup
</h4>
</div>
<div class="modal-body modal-list">
<div class="modal-content col-md-12">
<strong><?php _e(" <!--:en-->It's me<!--:--><!--:pl-->To Ja<!--:-->" ); ?> </strong>
<p>
<?php
$post = get_post(930);
$content = $post->post_content;
echo $content;
?>
</p>
</div>
</div>
<div class="modal-footer"><button class="btn btn-default" type="button" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
Do I need to tell my file it needs to read wordpress specific, or do I need to add my file somewhere in order to make it read?
edit
As i tried just echo'ing words like test , this works, so I have a feeling it has to do with the syntax Wordpress uses. Is there a way to make wordpress known it should be read with wordpress syntax?
edit 2
At the moment, i am having multiple subpages, so I only want to load certain modals for a certain page. For gdynia, i want to load only those. I updated the code and have now this.
else if (is_page ('gdynia')) {
get_template_part('modals-gdynia.php');
}
Yet nothing happens now. It used to be,
else if (is_page ('gdynia')) {
include_once(get_template_directory_uri() .'/modals-gdynia.php');
}
If you make use of get_template_part() you shoudn't have any issues.
The way you probably included your modals.php was probably calling wp_footer() for some reason.
so if you wanna use this template you just need to call it within the respective file you want it to.
header.php
single.php
footer.php
Are such template default files.
Within one of those just call it.
<?php
get_template_part('modals.php');
// Just in case you wanna use a variable from another context into this template.
$post_id = 930;
include(locate_template('modals.php'));
?>
Other than that i don't think their should be an issue it not working.
Tell me if it fixes your issues, maybe paste the code context where the modals.php is being called and how its being called.
This question is pretty specific, but I'll ask anyways.
First off, I know iframe's are probably not the best design but I don't know how else to solve my problem. Anyways, let me start of with some background information:
I have a page with some WebGL content on it (it just loads a .obj and .mtl model using Three.js, and adds some keyboard navigation for camera movement).
This page is structured so that it gets a variable using php's $_GET array, and then loads the model based on that variable (if the variable was "Bus" then it would load from obj/Bus/Bus.obj, and if the variable was "Shoe" then it would load from obj/Shoe/Shoe.obj).
The link to the page would be like "browser.php?name=Bus" or "browser.php?name=Shoe".
Now, I want to display several of these pages in a carousel of iframes. Because I am using Bootstrap, this task is trivial with the following code:
<div id="myCarousel" class="carousel slide">
<div class="carousel-inner">
<div class="item active">
<iframe src="browser.php?name=Bus" height="500" width="500">
<div class="container">
<div class="carousel-caption">
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
<br />
<br />
</div>
</div>
</div>
<div class="item">
<iframe src="browser.php?name=Shoe" height="500" width="500">
<div class="container">
<div class="carousel-caption">
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
<br />
<br />
</div>
</div>
</div>
</div>
</div><!-- /.carousel -->
This works perfectly except for one issue, the carousel-caption and all of its content are not showing. I am not sure if this is because of the iframe, or of the WebGL content, because when I just had an image there, its content was showing.
WebGL Iframe Carousel:
Normal Image Carousel:
Finally, my question: How do I fix my code / organization / design so that I can display the WebGL content in a carousel?
Sorry if this is a duplicate, but I was unable to find any relating links on google.
Thanks for taking your time to read/possibly answer this question,
Bucco
[EDIT]:
I just realized that my question was horribly worded, and was not clear enough. My main issue is with the navigator arrows not showing up in the WebGL content carousel (see the images). How do I fix my design / code so that I can display the WebGL content in a carousel with the navigator arrows?
The only obvious thing I see is that the <iframe>s are missing their closing tags, which are actually required according to the W3C (http://www.w3.org/TR/html-markup/iframe.html#iframe-tags).
I assume the normal behavior of an <iframe> is kicking in, which means that any children of the <iframe> are only displayed if the src cannot be loaded. Or, stated another way: lacking the closing tag, it looks like your navigation elements are treated as "fallback" content rather than sibling elements.
In fact, loading your content into a jsFiddle seems to prove me out: http://jsfiddle.net/dRtvH/ - w/o closing tags, no carousel, but simply closing the <iframe>s makes the nav buttons show up.