- Posts: 61
COMMUNITY FORUM
- Forum
- K2 Community Forum
- English K2 Community
- How do I move the K2 "item tools" from side to bottom of article?
How do I move the K2 "item tools" from side to bottom of article?
- that library
- Topic Author
- Offline
- Senior Member
Less
More
14 years 4 months ago #85426
by that library
How do I move the K2 "item tools" from side to bottom of article? was created by that library
Hello everyone! I'm using GavickPro's PostNote template and it displays the "item tools" (author, date created, hits, social sharing, etc.) on the left side of the article itself (link to my site that I'm working on now).I have two issues:1- NONE of the images are showing up for social sharing. I'm not getting any clear answer on the Gavick forum as to why or what to do about it, so I thought I'd ask here. I am absolutely positive that they are uploaded, and they are linked correctly within the k2.css that is inside the template, and also within the K2 component css file (I didn't do anything to them, just looked, and yes, they all point to the correct spot on the server)
2- I desperately need to move the "item tools" to below the article - they don't look right on my site and it takes up valuable real estate that I need for the article itself. I would like them to display below the articles like I have on this other site.
I'm just not sure how to manipulate or what to manipulate in order to force the article tools below. And if they aren't working at all, how to just make them disappear? (but that would be a shame)You will be able to see exactly what I am talking about by clicking the first link. The second link shows my pride and joy - I *LOVE* K2 !!
2- I desperately need to move the "item tools" to below the article - they don't look right on my site and it takes up valuable real estate that I need for the article itself. I would like them to display below the articles like I have on this other site.
I'm just not sure how to manipulate or what to manipulate in order to force the article tools below. And if they aren't working at all, how to just make them disappear? (but that would be a shame)You will be able to see exactly what I am talking about by clicking the first link. The second link shows my pride and joy - I *LOVE* K2 !!
Please Log in or Create an account to join the conversation.
- william white
- Offline
- Platinum Member
Less
More
- Posts: 3722
14 years 4 months ago #85427
by william white
Replied by william white on topic How do I move the K2 "item tools" from side to bottom of article?
What happens when you switch to a default template? Have you firebuged default template and then current template to see the differences?
Please Log in or Create an account to join the conversation.
- that library
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 61
14 years 4 months ago #85428
by that library
Replied by that library on topic How do I move the K2 "item tools" from side to bottom of article?
Honestly, I hadn't thought of that! I will try that today and see what I find. Thank you =)
Please Log in or Create an account to join the conversation.
- that library
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 61
14 years 4 months ago #85429
by that library
Replied by that library on topic How do I move the K2 "item tools" from side to bottom of article?
Ok, when I look at k2.css within the GK PostNote template, it delineates the "ItemTools" block to be on the left in its own column like so:
/* --- Additional left column in itemView --- */
#k2Container div.k2itemColumn {float: left; width:220px;}
#k2Container div.itemTools {clear: both; padding: 20px; }
#k2Container div.itemTools ul li { line-height: 2.5; border-bottom: 1px dotted #ccc}
#k2Container div.itemTools a.itemEmailLink {margin-left: 6px; padding-left: 6px; border-left: 1px solid #ddd}
whereas in the k2.css (in components/com_k2/css/k2.css) it does not anywhere say "itemTools" at all... each of the "tools" are just delineated separately, typically with a "display:block;float:left;"...
I switched the template to Ja_Purity and the font re-size, print & email, + author were at the top of the article, with the "additional info" (extra fields) at the bottom.
And the social sharing graphic buttons don't show up when I switched the template to Ja_Purity either? Weird!
I don't want to take all of these "itemTools" OUT, I just don't know how to move them to the top and bottom of the article within the PostNote template (like it does here) for example, just removing that left column entirely... any ideas?
I don't mean to be dense, I just don't know how to eliminate the column and put these items where (in my opinion) they look much better...
/* --- Additional left column in itemView --- */
#k2Container div.k2itemColumn {float: left; width:220px;}
#k2Container div.itemTools {clear: both; padding: 20px; }
#k2Container div.itemTools ul li { line-height: 2.5; border-bottom: 1px dotted #ccc}
#k2Container div.itemTools a.itemEmailLink {margin-left: 6px; padding-left: 6px; border-left: 1px solid #ddd}
whereas in the k2.css (in components/com_k2/css/k2.css) it does not anywhere say "itemTools" at all... each of the "tools" are just delineated separately, typically with a "display:block;float:left;"...
I switched the template to Ja_Purity and the font re-size, print & email, + author were at the top of the article, with the "additional info" (extra fields) at the bottom.
And the social sharing graphic buttons don't show up when I switched the template to Ja_Purity either? Weird!
I don't want to take all of these "itemTools" OUT, I just don't know how to move them to the top and bottom of the article within the PostNote template (like it does here) for example, just removing that left column entirely... any ideas?
I don't mean to be dense, I just don't know how to eliminate the column and put these items where (in my opinion) they look much better...
Please Log in or Create an account to join the conversation.
- william white
- Offline
- Platinum Member
Less
More
- Posts: 3722
14 years 4 months ago #85430
by william white
Replied by william white on topic How do I move the K2 "item tools" from side to bottom of article?
Just a quick note. I did a quick install of your template file. and looked at an existing article.
It came out as attached. Ill look further later
and will respond to your email after "thought"
It came out as attached. Ill look further later
and will respond to your email after "thought"
Please Log in or Create an account to join the conversation.
- that library
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 61
14 years 4 months ago #85431
by that library
Replied by that library on topic How do I move the K2 "item tools" from side to bottom of article?
Very interesting... I wonder why my social icons and font re-sizer icons aren't showing up?? I didn't change the links within the css files anywhere and I can see them on the server. *scratches head* hmmm
Please Log in or Create an account to join the conversation.
- that library
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 61
14 years 4 months ago #85432
by that library
Replied by that library on topic How do I move the K2 "item tools" from side to bottom of article?
One of the moderators over on the GK forum told me the answer:
in templates/gk_postnote/style1.css in class:
Code:
.k2itemColumn a {
background:none repeat scroll 0 0 transparent;
color:#444444 !important;
}
remove the line with background.
And it worked!! So that makes me very happy - now to just figure out how to make the tools show up on the top (author name, date, font re-sizer, print, email) and bottom (additional info, tweet this, social sharing icons, category) like K2 normally does...
in templates/gk_postnote/style1.css in class:
Code:
.k2itemColumn a {
background:none repeat scroll 0 0 transparent;
color:#444444 !important;
}
remove the line with background.
And it worked!! So that makes me very happy - now to just figure out how to make the tools show up on the top (author name, date, font re-sizer, print, email) and bottom (additional info, tweet this, social sharing icons, category) like K2 normally does...
Please Log in or Create an account to join the conversation.
- that library
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 61
14 years 4 months ago #85433
by that library
Replied by that library on topic How do I move the K2 "item tools" from side to bottom of article?
Unfortunately, they will not any questions about 'customisation' so I'm left back at square one for moving the K2 elements around... :/
Please Log in or Create an account to join the conversation.
- AdrianK
- Offline
- Senior Member
Less
More
- Posts: 46
14 years 4 months ago #85434
by AdrianK
Replied by AdrianK on topic How do I move the K2 "item tools" from side to bottom of article?
Do you have the spirit to add an change an own K2-template? Then it's simple, put the itemTools-DIV under the k2ItemContent-DIV.
Please Log in or Create an account to join the conversation.
- that library
- Topic Author
- Offline
- Senior Member
Less
More
- Posts: 61
14 years 4 months ago #85435
by that library
Replied by that library on topic How do I move the K2 "item tools" from side to bottom of article?
Thank you, Titus for your suggestion! I did that modification in the k2.css that is within the gk_postnote folder - the original was this (at the very bottom of the css file):
/* --- Additional left column in itemView --- */
#k2Container div.k2itemColumn {float: left; width:220px;}
#k2Container div.itemTools {clear: both; padding: 20px; }
#k2Container div.itemTools ul li { line-height: 2.5; border-bottom: 1px dotted #ccc}
#k2Container div.itemTools a.itemEmailLink {margin-left: 6px; padding-left: 6px; border-left: 1px solid #ddd}
So I moved the k2ItemColumn to here (in that same block as noted above):
#k2Container div.k2ItemContent, div.itemCommentsForm form {padding-left: 240px;}
div.itemCommentsWrap {padding: 0 20px 20px 240px;}
#k2Container div.k2itemColumn {float: left; width:220px;}
I think however, that it is necessary to get rid of the "item column" altogether, as making that change had absolutely no effect. I'm still stumped!
/* --- Additional left column in itemView --- */
#k2Container div.k2itemColumn {float: left; width:220px;}
#k2Container div.itemTools {clear: both; padding: 20px; }
#k2Container div.itemTools ul li { line-height: 2.5; border-bottom: 1px dotted #ccc}
#k2Container div.itemTools a.itemEmailLink {margin-left: 6px; padding-left: 6px; border-left: 1px solid #ddd}
So I moved the k2ItemColumn to here (in that same block as noted above):
#k2Container div.k2ItemContent, div.itemCommentsForm form {padding-left: 240px;}
div.itemCommentsWrap {padding: 0 20px 20px 240px;}
#k2Container div.k2itemColumn {float: left; width:220px;}
I think however, that it is necessary to get rid of the "item column" altogether, as making that change had absolutely no effect. I'm still stumped!
Please Log in or Create an account to join the conversation.
- Forum
- K2 Community Forum
- English K2 Community
- How do I move the K2 "item tools" from side to bottom of article?