I work for 2 sister companies and we have copied the template of one website to another for most of the functionality.
For some reason, I cannot get the pagination to work as it does on the one website. We are using a custom theme so I can't seem to get any plugins to work.
The pagination works well here: https://clcanursing.co.uk/news/ and I want to be able to replicate how it looks and how it reacts to tablet and mobile devices. I am trying to copy it onto this page: http://clcacalldirect.com/blog/ but it fails here.
Any help would be appreciated!!
Thanks,
Andy
It seems like your issue is CSS related. You're missing some styles (like the one below). Make sure you're copying over all styles.
Use dev tools to see the differences between the two slices of code.
EDIT:
The below code gives you the exact style and functionality on tablet/mobile
#media (max-width: 1200px) {
.pagination .default--button {
border-radius: 0;
width: 49% !important;
text-align: center;
margin-top: 70px;
}
}
Related
...running wordpress Version 5.9.2 : i was wondering if there’s an easy way to customize the CSS for the featured image to appear with full width. At the moment the image has a huge margin - and is not full width as it appears on the page (see below) - https://www.job-starter.com/
i tried to get this to work with this WordPress theme by including some code into the custom CSS option - see below;
what is aimed: How can I set the featured images to a full width:
i tried the following code snippets in the option additional CSS:
FIGURE.block-image IMG {
max-width: 320px;
height: auto;
}
#2
FIGURE.block-image IMG {
max-width: 320px;
height: auto;
}
or
.block-image IMG {
width: 600px;
height: auto;
}
see the examination of the page:
Update: Hello dear #Howard E many thanks for the quick reply. Great to hear from you. I am so glad that you hepled me. Its awesome: i am running the theme called jobify: see the demo page: - Here is the live site - with the demo of this theme:
https://2709.getwpt.tech/ and besides here:
https://jobify-demos.astoundify.com/extended/
Question: Can we get the look and feel of the theme like it is shown on the demo-pages? That would be great. Many thanks in advance. - You saved my day.
Your question is a little vague. If you want to make the first wp-block-image on every page 100% width, you can do this. But it will work on every page.
You need to understand better how to scope your css.
But this should work.
article .wp-block-image:first-of-type img {
width: 100%;
}
I'm using Dokan plugin for my website. My problem is need to remove extra space between heading & banner (Check screenshot 1). And I find a solution using web inspect tool. If i change the padding-bottom to 0px its working fine.(check screenshot 2). so I try to find that CSS class in my website backend, i found a same CSS class regarding my issue but if I change it not working in my website.
The CSS class in martfury/style.css
.page-header-page .entry-title {
padding-top:0px;
padding-bottom:0px;
font-size: 48px;
font-weight: 600;
text-align: center;
margin-bottom: 0;
}
I search every CSS file but nothing found also try to clear data. Nothing help me. If any one know how to solve this please help me.
I'm really thankful for your time.
Just try with !important like given below
padding-bottom:0px !important;
I think you CSS not able to overwrite so !important will be work there.
I'm trying to make a single link in a WordPress top navigation menu that has a different background color but running into some issues.
What I have works on most of my pages but others not (as seen below). I assigned a CSS class (.contact-us-menu) to the individual menu item in the menu builder in WordPress, but I can seem to figure out how to get it to work across all the pages.
Wrong. (https://www.csolsinc.com/insights/)
Correct. (https://www.csolsinc.com/insights/webinars/)
This is the custom CSS I added with the "Wordpress Add Custom CSS" plugin.
li.contact-us-menu {
background-color:#f47e00!important;
height:50px!important;
border-radius:50px!important;
padding-right:15px;
color:#ffffff!important;
font-weight:bold!important;
vertical-align:middle;
}
li.contact-us-menu a {
color:#ffffff!important;
}
Any advice?
I looked through both of your site pages to look for the differences and I am seeing this line affecting the 'wrong' links:
#top-menu .menu-item .dropdown-toggle {
position: relative;
top: 11px !important;
For a fix, with your I would either change the top to -1px as in your 'correct'
or try to add:
li.contact-us-menu {
line-height: 50px;
}
to your css.
I'm trying to add an arrow to the left hand side of my active link in my categories sidebar for my wordpress site I'm building.
I've already put in the css for it to behave the way I'd like it, I've added a small change in colour just so I know it's working well.
I've attempted to add a background image with a small .png file and tried various CSS styling to get it how I want it but I've had no luck even showing the image.
I'm open to using the character such as "➤" or the like if I cannot use a background image, maybe I might be missing something.
http://94.23.211.70/~cewp/product-category/cushions/
The above my my URL that will go directly to the page you're wanting to see along with a link already highlighted on the sidebar.
Here is the css that is making this active:
.product-categories .current-cat a {
color: #000033;
background-image: url("images/ICONNAMEHERE.png");
}
Hopefully this is enough information to provide, anymore then just ask me.
Regards
You can achieve this by css and font awesome. First add font awesome to your project. You can also use unicode charecters instead.
.widget_product_categories li { margin-left: 2.5em; }
.widget_product_categories li:before {
display: block;
float: left;
margin-left: -2.5em;
font-family: 'fontawesome';
font-size: 14px;
content: "\f054";
}
if not interested in adding font awesome content:url("images/ICONNAMEHERE.png");
I am in the process of creating my first wordpress template.
I have a top nav that is however pushed down by
html {
margin-top: 32px !important;
}
I found that this particular style is in the admin-bar.php file that came when I downloaded wordpress on my local machine.
I could just take the lines out of that file but that doesn't do the job because I want to create a template that can be bundled and uploaded to anyones wordpress.
Is there a way I can overwrite the above styling through my own template?
I hope this makes sense
Thank you so much
With css you can just do the following
html {
margin-top: 0px !important;
}
and it'll automatically override it.
But I can't tell exactly what you are trying to do.
You could enqueue a css file to the bottom of the page and overwrite the above with:
html{
margin-top: 0px !important;
}
It has to be the last CSS file to be linked.
I'm adding this for future reference because previous answers respond to the CSS question, but the issue here is not the CSS part, in fact html { margin-top: 32px !important; } is added by Wordpress for the toolbar.
As the reference says:
Note: If you have turned the Toolbar on in your profile settings, but still don't see it on the front end of your site, it may be that your theme does not call wp_footer() in its footer.php file, or the Toolbar may be disabled by a plugin.