Im trying to edit my webisites blog that I inherited from a creator I have no contact with. I have been fiddling with the site for a little more than a week but I don't know how to edit the links in the blog index.
Here is the link to my site's blog:
http://bestdetails.com/blog/
As you can see the box is a link to the whole article, and in the article if you scroll down you can see the tags for the post.
I want the tags inside the box to show on the blog index page instead.
I want to put the tags where the red circle is:
I know that you can edit the blog in the blog.php, but I don't know what code or where in the HTML text to put that code.
In order to access the post tags, you have the function get_tags();
It is called this way:
$tags = get_tags();
$html = '<div class="post_tags">';
foreach ( $tags as $tag ) {
$tag_link = get_tag_link( $tag->term_id );
$html .= "<a href='{$tag_link}' title='{$tag->name} Tag' class='{$tag->slug}'>";
$html .= "{$tag->name}</a>";
}
$html .= '</div>';
echo $html;
The place to edit will depend on your Theme, it can be in the index, the page.php or the blog.php. Take a look at your Settings -> Reading and see what page is acting as home and which is acting as blog. After that go to pages and see what template is associated, if any.
Related
I'm learning how PHP works, but at the same time I have to redesign an custom CMS.
CMS is written in PHP, I have restyled the default menu using CSS and added a side slide effect. But now, I need to keep this side panel opened, when I click on a link from the menu. I think, the easiest way is prevent page reload = to make menu links open in a page content section (<div id="content"></div>). But because in a source code, there are lots of functions, variables etc., I really need your help, how to proceed.
/Admin/index.php - content from menu sections (placed in separate files) is called here using a function
AdminLib/CSS/style.css - contains also styles for side menu
AdminLib/Include/menu.php - here is defined a side menu (ul, li)
/Admin/index.php
...
...
...
<body>
<?php if ($page != 'login') {
$menu_obj = new AdminMenu(dirname(__FILE__).'/Tabdefs/');
echo $menu_obj->GetHtml();
?>
<div class="site-wrap">
<?php
}
ContContent();
?>
</div>
...
...
...
AdminLib/Include/menu.php
...
...
...
//vrati html pro svoje menu
public function GetHtml() {
$html = '<ul class="navigation">';
$html .= $this->GetHtmlRecursive($this->menu_def);
$html .= '</ul>';
$html .= '<input type="checkbox" id="nav-trigger" class="nav-trigger" /><label for="nav-trigger"></label>';
return $html;
}
/********** PRIVATE ***********/
//vrati html pro vsechny polozky menu v poli $arr; Pokud tam nejaka ma sub, tak se vola rekurzivne
private function GetHtmlRecursive($arr) {
$html = '';
foreach ($arr AS $item) {
//neukazovane polozky rovnou preskakuju
if ($item['show'] != 'Y')
continue;
//ted jestli mam podpolozky, tak rekurzujeme
if (isset($item['sub'])) {
$html .= '<li class="nav-item">'.$item['nazev'].''.
'<ul class="nav-item">';
$html .= $this->GetHtmlRecursive($item['sub']);
$html .= '</ul></li>';
}
else {
//pokud podpolozky nemam, tak vypisu normalni polozku
$html .= '<li class="nav-item">'.$item['nazev'].'</li>';
}
} //foreach pres polozky $arr
return $html;
}
...
...
...
I trying to integrate something like this - using jQuery script (How to target the href to div - 2nd and 3rd link on JsFiddle) into my source code, but I need help with realisation - I wasn't able to make it working.
Instead of getting the links to target specific divs, you could always use anchor tags. They use the a tag to go to the relevant point on a page.
An anchor tag would be created like the following:
<a name="location1"></a>
To link to that with your a tag, you can then do:
Link Text
That link will then take you to the anchor location on the page.
If you really want to do it by div ID and use jQuery (which will enable you to scroll to it rather than a straight jump), then if you create your link to something like the following :
Link Text
If the page then has the div:
<div id="location1">Contrent of the div</div>
and your page has the function (either on page or in an external file) :
function scrollToLocation(location_id) {
$('body').animate({
scrollTop: $('#' + location_id).offset().top
}, 500);
}
There's more information on Stack Overflow in the following questions:
jQuery .scrollTop(); + animation
jQuery jump or scroll to certain position, div or target on the page from button onclick
I recently made a page where I can monitor website traffic. I came so far as to replace a certain keyword with some html markup and making links clickable. But here is the problem. whenever I click a link with html markup it messes up the link with the <mark> and <b> tag. How do I remove the tags from the <a>?
Here is what I have so far:
$output = shell_exec('tail -n50 /var/log/nginx/access.website.log');
$output = preg_replace('!(((f|ht)tp(s)?://)[-a-zA-Zа-яА-Я()0-9#:%_+.~#?&;//=]+)!i', '<a target="_blank" href="$0">$0</a>', $output);
$keyword = "twitch.tv|facebook.com|4chan.org|adf.ly|j.gs|q.gs|twitter.com|goo.gl|google.com|vk.com";
$output = preg_replace("/($keyword)/i","<b><mark>$0</mark></b>",$output);
echo "<pre>Access log:<br>$output</pre>";
I have a challenge with a wordpress theme I'm developing, but I think what I'm after is really just a general php/JS solution, nothing Wordpress specific.
So I have the below code with pulls in the thumbnail and description for an array of images I have uploaded. What I'd like to do is when a user clicks on the link the description and caption associated with that image is displayed in a div elsewhere on the page.
My issue is that so far the only way I can think of to do that is to set a javascript variable within my php foreach statement, but the problem with that is that this overwrites the variable value each time (as I can't change the variable name) so by the end of it all I don't have a different JS variable for each image, I just have one with the details from the last image in the array.
I know AJAX might be one way forward, but I know pretty much nothing about it. If anyone can help point me in the right direction I'd really appreciate it.
Thanks
<?php
$gallery_images = get_custom_field('galleryImages:to_array');
foreach ($gallery_images as $galleryID) {
$description = $attachment->post_content; //get image description
$caption = $attachment->post_excerpt; //get image caption
?>
link
<?php
}
?>
<div id="targetDiv"></div>
I think you're going about this the wrong way, personally. Using AJAX to interact with a WordPress site seems like overkill for the simple ability of showing some peripheral information about an image.
What I would do is have WordPress spit out the image, along with the caption info when the page is initially downloaded, but hide the caption info and then use client-side JavaScript to show/hide it when it's needed.
<?php
$button_html = "";
$caption_html = "";
$gallery_images = get_custom_field('galleryImages:to_array');
$gallery_images_count = 0;
foreach ($gallery_images as $galleryID) {
$description = $attachment->post_content; //get image description
$caption = $attachment->post_excerpt; //get image caption
$button_html .= '<div id="caption-button-' . $gallery_images_count . '" class="show-caption-button">Show Caption</div>';
$caption_html .= '<div id="caption-' . $gallery_images_count . '" style="display:none;">' . $caption . '</div>';
$gallery_images_count++;
}
echo '<div id="buttonDiv">' . $button_html . '</div>';
echo '<div id="targetDiv">' . $caption_html . '</div>';
?>
Then the JavaScript/jQuery:
$('.show-caption-button').click(function(){
var caption_id = $(this).prop('id').substring(15);
$('#caption-'+caption_id).eq(0).toggle();
});
It's hard to test without setting up a WordPress myself, but essentially what we're doing is adding caption divs with numbered id's to a string variable in PHP as we're looping through our images. Then, at the end of the loop, we echo that out to the page.
In JavaScript/jQuery, we're grabbing the corresponding id of the caption button and using it to toggle the relevant caption further down in the page.
I have just noticed that when viewing an individual node, that the seems to be Image:, Content: and Tags: embedded as a result from the render function. Does any one know how to remove these? (Google turns up nothing, like most Drupal questions)
Regards
EDIT:
Lets say I have a page which loads in taxonomy nodes into a carousel. If I view the page It looks pretty much as intended. If I view each of the nodes individualy /taxonomy/node it appears as:
Image:
[the images]
Content:
[the content]
Tags:
[list of tags]
Same goes if instead of the previous page loading the nodes as they currently do and I do it like so:
$ids = taxonomy_select_nodes(array(1));
$professional_nodes = node_load_multiple($ids);
foreach( $professional_nodes as $view ) {
echo '<li>' . drupal_render(node_view($view) ) . '</li>';
}
I get the same outcome.
There are several ways to do that, here is a quick solution
Try to print the teaser version of the nodes, and customize the appearance of the teaser from manage display page admin/structure/types/manage/page/display/teaser.
You will just need to add teaser as a second argument to node_view to print the teaser version.
$ids = taxonomy_select_nodes(array(1));
$professional_nodes = node_load_multiple($ids);
foreach( $professional_nodes as $view ) {
echo '<li>' . drupal_render(node_view($view, "teaser")) . '</li>'; // the edited line.
}
Hope this works... Muhammad.
I'm trying to style a custom menu within drupal.
I've sucessfully styled to display a background image, but the problem is that the menu item title still displays. So I get a nice image, with blazoned all over it.
Is there a template function I could use to format the custom menu and remove the text portion from the hyperlink?
I've done something similar on my primary links (see below) but I could do with some help figuring out how to do so on the custom menus.
function primary_links_add_icons() {
$links = menu_primary_links();
$level_tmp = explode('-', key($links));
$level = $level_tmp[0];
$output = "<ul class=\"links-$level\">\n";
if ($links) {
foreach ($links as $link) {
$link = l($link['title'], $link['href'], $link['attributes'], $link['query'], $link['fragment']);
$cssid = str_replace(' ', '_', strip_tags($link));
$link = preg_replace('#(<a.*?>).*?(</a>)#', '$1$2', $link);
$output .= '<li id="'.$cssid.'">' . $link .'</li>';
};
$output .= '</ul>';
}
return $output;
}
And then this called within the page.tpl.php
print primary_links_add_icons();
Thanks for any help!
theme_menu_tree would be the way to resolve this on the template.php itself. The meat of your function would be identical to your function above. Documentation is at http://api.drupal.org/api/function/theme_menu_tree
But, I would recommend using CSS for what you're doing. If the text is removed entirely (via php) then you'll be depending on the user's browser to display the images and CSS properly and make navigation possible.
You might consider including both the image and the text, but making the text portion display: none so that it degrades more gracefully if CSS isn't loaded properly.