A question about plugins, browsers and styling
Posted: Wed Feb 06, 2019 10:19 pm
I'm using the Clean Blog theme.
I've never before worked with any kind of code.
My goal was to to add tags to display horizontally at the footer on all the pages.
So I've created a page which contains this code which I found in this community
And then I've inserted this code above social networks in the index.php
That worked, but I had to fix the styling. And that's probably where i start to look stupid.
I found this code online and changed it a bit, then added it to the css file.
And then I edited this bit in plugin.php so it looks like:
That seemed to work like i wanted it in Firefox, Opera and Edge. But it doesn't work in Chrome. It's as if the Chrome doesn't read all of the css code I've added. I've attached some screenshots of what it looks like in Firefox and Chrome.
I also noticed that when I changed footer padding, Firefox displayed the changes correctly, but it didn't make any difference in Chrome. If I open up the Chrome inspector and find footer padding, the value is not corresponding to what's in the css file.
Am I doing something wrong?
I've never before worked with any kind of code.
My goal was to to add tags to display horizontally at the footer on all the pages.
So I've created a page which contains this code which I found in this community
Code: Select all
<?php
// Class name of the plugin
$className = 'pluginTags';
// Get the Plugin-Object
$plugin = getPlugin($className);
// Print the plugin label
echo $plugin->label();
// Execute the hook siteSidebar of the plugin and print it
echo $plugin->siteSidebar();
?>
Code: Select all
<?php
include(THEME_DIR_PHP.'tags.php');
?>
I found this code online and changed it a bit, then added it to the css file.
Code: Select all
ul.tags {
list-style-type: none;
margin: 0;
padding: 0px;
padding-bottom: 15px;
overflow: hidden;
background-color: #FFFFFF;
text-align: center;
}
li.tag {
display: inline-block;
}
li.tag a {
display: inline-block;
color: black;
text-align: center;
padding: 10px 12px;
text-decoration: none;
}
li.tag a:hover:not(.active) {
background-color: none;
color: #0085a1;
}
Code: Select all
$html .= '<ul class="tags">';
// By default the database of tags are alphanumeric sorted
foreach( $tags->db as $key=>$fields ) {
$html .= '<li class="tag">';
$html .= '<a href="'.DOMAIN_TAGS.$key.'">';
$html .= $fields['name'];
$html .= '</a>';
$html .= '</li>';
}
$html .= '</ul>';
I also noticed that when I changed footer padding, Firefox displayed the changes correctly, but it didn't make any difference in Chrome. If I open up the Chrome inspector and find footer padding, the value is not corresponding to what's in the css file.
Am I doing something wrong?