Need help with some problems GameMagazine

GK User
Thu Nov 20, 2014 4:30 pm
Hi.

1. I wanted to change the titles of the header tabs. So I went to the module ''Header tab'' -> tabs, but there is no tabs here and the button ''add new tab'' is not working. Am I doing it the right way?

2. In attachment 1 I want to reduce the space where I have written ''1'' Can you please give me the CSS code I need to add at the back end? This is the K2 article: http://islamqa.no/kategorier/islamske-v ... r-det-selv

3. In attachment 1 I want to reduce the font size where I have written ''2'' Can you please give me the CSS code I need to add at the back end?

Attachment 1.png


4. Attachment 2 is from the front page of another similar site I am developing http://www.islamqav.com Here I am using the component HWD mediashare for videos. As you can see the modules on the picture are to close the titles of the tabs. I wan to add some space between the tab-titles and the content from the module. Can you please give me the CSS code I need to add at the back end?

Attachment 2.png


5. Is it possible for the module Image Show GK4 that is used on the front page to catch content from ''featured'' k2 articles in stead of or in addition to adding slides manually? It take a lot less time to just put an article on featured than making a new slide in the module. How exactly can I make it happen?

6. The superscript is not working. The numbers I have put in superscript (see in the bottom of the article) as references, are showing in normal size: http://islamqa.no/kategorier/teologi-og ... hos-laerde

See the Attachment 3 where it is supposed to be in superscript.

Attachment 3.png
User avatar
Gold Boarder

teitbite
Sat Nov 22, 2014 1:52 pm
Hi

6. Please use typography instead http://demo.gavick.com/joomla25/gamemag ... typography

5. No it's not possible. Image Show was implemented for slides not latest articles. Please use News Show Pro instead.

4. Please add this to css:

Code: Select all
#gkHeader .gkTabsItem {
    padding: 25px 0;
}


3. Here is the code:

Code: Select all
.nspArt h4.nspHeader {
    font-size: 14px;
}


2. Spaces You can reduce by removing the padding in NSP configuration "article layout" section and margin from the image.

1. I do not see tabs anywhere. Is this because it's not working ? Have You updated module to the latest version ?
User avatar
Moderator

GK User
Sat Nov 22, 2014 5:03 pm
Thanx a lot for helping, you almost solved all the issues.

1. I do not see tabs anywhere. Is this because it's not working ? Have You updated module to the latest version ?

I just updated it, but you are right, the tabs were not working, except in firefox. But now after updating they don't work at all. Can you help me fix this?

6. I did not find superscript in typography. Is there noe way to make it function?

7. Is it possible to reduce the space in between the lines where I have marked on the attached picture:
Skjermbilde 2014-11-22 kl. 17.00.50.png
User avatar
Gold Boarder

teitbite
Sun Nov 23, 2014 12:28 pm
Hi

1. Please send em an access to joomla panel.
6. There are other elements You can use. To be honest I'm making websites for over 20 years and I remember using twice :) So I assume other developers has the same problem and forgot to style it because of it. Or just tell me how You want this to be styled and we may add a new style for it.
7. Use this:

Code: Select all
.nspArt h4.nspHeader {
    line-height: 18px;
}
User avatar
Moderator

GK User
Sun Nov 23, 2014 3:21 pm
Hi. Thanx a lot for helping!

1. I have sent you the admin details on PM.

5. No it's not possible. Image Show was implemented for slides not latest articles. Please use News Show Pro instead.


I just tried using NSP in http://www.islamqa.no (not http://www.islamqav.com), but I were not able to configure it correctly. While you are checking out the tabs problem, is it possible that you have a look at the NSP module I have named ''Utvalgte spørsmål NY'' showing on module position ''tab1''. I want it to look something similar to how Image Show GK4 is displayed on this template, as shown here (with the automatic change of the big picture, and also small thumbnails for the other articles showing on the side):
Skjermbilde 2014-11-23 kl. 15.18.46.png


6. I understand. I just want it to be smaller and a little higher, as in this screenshot from how it is supposed to look in MS Word:
Skjermbilde 2014-11-23 kl. 15.10.40.png


7. It worked great in the modules, but did not work in the main text on the site as I marked in the attached picture:
Skjermbilde 2014-11-22 kl. 17.00.50.png


I really do appriciate the great support :)
User avatar
Gold Boarder

teitbite
Mon Nov 24, 2014 11:01 am
Hi

7. Bottom arrows were cut :)

Code: Select all
body {
    line-height: 1.6;
}


6. Please try add this code:

Code: Select all
sup {
    font-size: smaller;
    position: relative;
    top: -5px;
}


5. I only meant that NSP module was made to show latest articles, but if You need a thumbs to rotate between articles than it will not be a good module to use. You need to use some 3rd party one.

1. Looks like I will need to show this to programmers. Please send me an access to FTP. I have disabled social buttons plugin to work with tabs. Please keep it like that for now.
User avatar
Moderator

GK User
Tue Nov 25, 2014 4:42 pm
1. I have sent you the ftp details on PM.

5. Thanx. Are you able to configure it so it looks like how it is on the News template http://demo.gavick.com/joomla25/news/ ? I am not able to do it and when I enable the module it automatically removes all the thumbnails on other modules on my front page. Can you please have a look into it?

Thanx a lot for the help :)
User avatar
Gold Boarder

teitbite
Wed Nov 26, 2014 8:22 pm
Hi

1. I informed programmers. Will let You know when they will answer.

5. Here are settings from News2, please simply configure the module the same way: https://www.gavick.com/documentation/jo ... iguration/

If thumbnails are broken when publishig it than please do not use an option to create image thumbs. It's possible Your server does not support that.
User avatar
Moderator

teitbite
Thu Nov 27, 2014 1:27 pm
Hi

1. Programmers fix this on one of Your sites. Looks like it was because of a module override in /html folder. So please remove this override from the other website or add class "gkTab" to <li></li> elements of navigation in override.
User avatar
Moderator

GK User
Fri Nov 28, 2014 2:00 pm
Hi.

1. Thanx! I have no idea how to do this, can you please give me some more info or ask the programmers to do it on the other site as well?

5. Thanx! I actually wanted it to look like News and nit News 2, but even in the link you sent I did not see where the module settings for this module is. How to proceed?
User avatar
Gold Boarder

teitbite
Fri Nov 28, 2014 10:20 pm
Hi

1. Please simply take the /html/com_tabs_gk5 and copy it to Your other site.

2. Please take a look at the module published in "mainbody_top" module position in the list (point 11). Here is a correct link. I've send You to News2 by accident: https://www.gavick.com/documentation/jo ... on-joomla/
User avatar
Moderator

GK User
Sun Nov 30, 2014 4:21 pm
1. Thanx!

2. I have tried it now, but its still the same and I am not getting the look as in the News template. Can you please have a look?
User avatar
Gold Boarder

teitbite
Mon Dec 01, 2014 10:16 am
Hi

2. I had no problems to copy settings ;/ https://www.gavick.com/documentation/wp ... 9-tabs.png Module looks good, I called it "Fresh News" and showing newest articles.
User avatar
Moderator

GK User
Mon Dec 01, 2014 7:15 pm
Hi.

2. Thanx. I moved it to show on position ''tab1'', but turned it off because it does not look like the news template. The main problems are:

- The main title is too small.
- The background color does not change when I hoover over the titles.
- The buttons to see older news are not there.
- You used gk4 and not gk5, maybe that is why I am not able to turn on thumbnails on the links?
- There is no space between the links and the main image.
User avatar
Gold Boarder

teitbite
Wed Dec 03, 2014 10:10 am
Hi

That's because it's a different template and in news template some of the styles are picked up from template's css. We do not support moving elements from one template to other, but please try to copy the css for NSP I found in News template:

Code: Select all
.nsp {
    position: relative;
}
.nspMain {
    overflow: hidden;
}
.nspBotInterface, .nspTopInterface {
    clear: both;
    overflow: hidden;
}
.nspBotInterface div, .nspTopInterface div {
    float: right;
}
.nsp .nspTopInterface div {
    padding: 0 3px;
    position: absolute;
    right: 16px;
    top: 16px;
    z-index: 10;
}
.nspPagination {
    float: left;
    list-style-type: none !important;
    margin: 5px 0 0 !important;
    padding: 0 !important;
}
.nspPagination li {
    background: none repeat scroll 0 0 #d6d6d6;
    border: medium none !important;
    border-radius: 50%;
    cursor: pointer;
    float: left;
    height: 8px;
    margin: 1px 3px 0 1px !important;
    padding: 0 !important;
    text-indent: -999em;
    width: 8px;
}
.nspPagination li:hover, .nspPagination li.active {
    background: none repeat scroll 0 0 #e25b32;
    height: 10px;
    margin: 0 2px 0 0 !important;
    width: 10px;
}
.nspNext, .nspPrev {
    background: url("../images/style1/nsp_interface.png") no-repeat scroll -14px 0 rgba(0, 0, 0, 0);
    cursor: pointer;
    float: left;
    height: 14px;
    margin: 3px 0 0 4px;
    text-indent: -999em;
    width: 14px;
}
.nspPrev {
    background-position: 0 0;
}
.nspNext:hover, .nspPrev:hover {
    background-position: -14px -14px;
}
.nspPrev:hover {
    background-position: 0 -14px;
}
.nspCounter {
    border: 1px solid #ddd;
    border-radius: 2px;
    color: #878787;
    cursor: pointer;
    float: left;
    font-size: 9px;
    margin: 0 0 0 8px;
    padding: 1px 4px;
}
.nspArts {
    overflow: hidden;
}
.nspArtPage {
    float: left;
}
.nspArt {
    box-sizing: border-box;
    float: left;
}
.nspArt div {
    overflow: hidden;
}
h4.nspHeader {
    color: #363636;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 10px;
}
.nspArt h4.nspHeader a {
    color: #363636;
    text-decoration: none;
}
.nspArt h4.nspHeader a:active, .nspArt h4.nspHeader a:focus, .nspArt h4.nspHeader a:hover {
    color: #eb592a;
}
.nspArt a {
    transform-style: preserve-3d;
}
.nspArt img.nspImage {
    border: medium none;
    transition: all 0.4s ease 0s;
}
.nspArt img.nspImage:hover {
    transform: scale(1.15) rotate(-1.5deg);
}
.nspArt .nspImageWrapper {
    overflow: hidden;
}
.nspArt p.nspText {
    color: #777;
    float: none;
    font-size: 12px;
    margin: 0;
}
.nspArt p.nspText + .readon {
    margin-top: 32px;
}
.nspArt p.nspText + .nspInfo {
    margin-top: 12px;
}
.nspArt p.nspInfo {
    color: #999;
    font-size: 11px;
    font-style: normal;
    font-weight: 300;
    line-height: 1;
    margin: 0 0 5px;
}
.nspArt p.nspInfo a {
    color: #999;
    padding-left: 8px;
}
.nspArt p.nspInfo a:active, .nspArt p.nspInfo a:focus, .nspArt p.nspInfo a:hover {
    color: #eb592a;
}
.nspArt .tleft {
    text-align: left;
}
.nspArt .tright {
    text-align: right;
}
.nspArt .tcenter {
    text-align: center;
}
.nspArt .tjustify {
    text-align: justify;
}
.nspArt .fleft {
    float: left;
}
.nspArt .fright {
    float: right;
}
.nspArt .fnone {
    clear: both;
    float: none;
    width: 100%;
}
.readon.left, .readon.right, .readon.center {
    clear: both;
}
.readon.left {
    float: left;
}
.readon.right {
    float: right;
}
.readon.center {
    display: inline;
    float: none;
}
.nspList {
    float: left;
}
.nspLinks .nspLinkScroll1 div ul {
    list-style-type: none !important;
    padding: 0 !important;
}
.nspLinks .nspLinkScroll1 div ul li {
    border-top: 1px solid #e5e5e5;
    margin: 0 !important;
    padding: 14px 0;
}
.nspLinks ul li h4 {
    color: #2f3133;
    font-size: 12px;
    font-weight: bold;
    line-height: 16px;
}
.nspLinks ul li h4 a {
    text-decoration: none;
}
.nspLinks ul li p {
    font-size: 12px;
    line-height: 22px;
    margin: 0;
}
.nspArts.left {
    float: right;
}
.nspLinksWrap.left {
    float: left;
}
.nspArts.right {
    float: left;
}
.nspLinksWrap.right {
    float: right;
}
.nspMain .unvisible {
    height: 1px;
    left: -10000px;
    overflow: hidden;
    position: absolute;
    top: auto;
    width: 1px;
}
.nspFs80 {
    font-size: 80%;
}
.nspFs90 {
    font-size: 90%;
}
.nspFs100 {
    font-size: 100%;
}
.nspFs110 {
    font-size: 110%;
}
.nspFs120 {
    font-size: 120%;
}
.nspFs130 {
    font-size: 130%;
}
.nspFs140 {
    font-size: 140%;
}
.nspFs150 {
    font-size: 150%;
}
.nspFs160 {
    font-size: 160%;
}
.nspFs170 {
    font-size: 170%;
}
.nspFs180 {
    font-size: 180%;
}
.nspFs190 {
    font-size: 190%;
}
.nspFs200 {
    font-size: 200%;
}
.gkResponsive {
    line-height: 1;
}
.gkResponsive img.nspImage, img.nspImage.gkResponsive {
    height: auto;
    width: 100% !important;
}
.gkResponsive a, a.gkResponsive {
    display: block;
    position: relative;
}
.gkResponsive {
    position: relative;
}
.nspArt img.nspImage {
    max-width: 100%;
}
.nspArtScroll1, .nspLinkScroll1 {
    overflow: hidden;
    width: 100%;
}
.nspPages1 {
    width: 100%;
}
.nspPages2 {
    width: 200%;
}
.nspPages3 {
    width: 300%;
}
.nspPages4 {
    width: 400%;
}
.nspPages5 {
    width: 500%;
}
.nspPages6 {
    width: 600%;
}
.nspPages7 {
    width: 700%;
}
.nspPages8 {
    width: 800%;
}
.nspPages9 {
    width: 900%;
}
.nspPages10 {
    width: 1000%;
}
.nspCol1 {
    width: 100%;
}
.nspCol2 {
    width: 50%;
}
.nspCol3 {
    width: 33.3%;
}
.nspCol4 {
    width: 25%;
}
.nspCol5 {
    width: 20%;
}
.nspCol6 {
    width: 16.66%;
}
.nspCol7 {
    width: 14.285%;
}
.nspCol8 {
    width: 12.5%;
}
.nspCol9 {
    width: 11.1%;
}
.nspCol10 {
    width: 10%;
}
.nspCol11 {
    width: 9.09%;
}
.nspCol12 {
    width: 8.33%;
}
.nspCol13 {
    width: 7.69%;
}
.nspCol14 {
    width: 7.14%;
}
.nspCol15 {
    width: 6.66%;
}
.nspCol16 {
    width: 6.25%;
}
.nspCol17 {
    width: 5.88%;
}
.nspCol18 {
    width: 5.55%;
}
.nspCol19 {
    width: 5.26%;
}
.nspCol20 {
    width: 5%;
}
.dark .nspArt p.nspText {
    color: #999;
}
.dark .nspArt p.nspInfo {
    color: #ddd;
}
.dark .nspArt p.nspInfo a {
    color: #fff;
}
.dark .nspArt p.nspInfo a:active, .dark .nspArt p.nspInfo a:focus, .dark .nspArt p.nspInfo a:hover {
    color: #ddd;
}
.dark .nspLinks ul li h4 a {
    color: #fff;
}
.dark .nspLinks ul li h4 a:active, .dark .nspLinks ul li h4 a:focus, .dark .nspLinks ul li h4 a:hover {
    color: #eb592a;
}
.dark .nspArt h4.nspHeader a {
    color: #fff;
}
.dark .nspArt h4.nspHeader a:active, .dark .nspArt h4.nspHeader a:focus, .dark .nspArt h4.nspHeader a:hover {
    color: #eb592a;
}
.dark .nspPagination li {
    background: none repeat scroll 0 0 #ccc;
}
.dark .nspPagination li:hover, .dark .nspPagination li.active {
    background: none repeat scroll 0 0 #fff;
}
.dark .nspNext, .dark .nspPrev {
    background: url("../images/style1/nsp_interface.png") no-repeat scroll -17px 0 rgba(0, 0, 0, 0);
}
.dark .nspPrev {
    background-position: 0 0;
}
.dark .nspNext:hover, .dark .nspPrev:hover {
    background-position: -17px -22px;
}
.dark .nspPrev:hover {
    background-position: 0 -22px;
}
.header .nspLinks ul li h4 {
    font-size: 13px;
}
.header .nspLinks ul li h4 a {
    color: #333;
}
.header .nspLinks ul li p {
    font-size: 11px;
}
.box.header .nspBotInterface div {
    float: none;
    margin-top: 12px;
    text-align: center;
}
.box.header .nspBotInterface div ul {
    display: inline-block;
    float: none;
}
.box.header .nspImageWrapper {
    position: relative;
}
.box.header .nspImageWrapper h4 {
    background: none repeat scroll 0 0 #1c1c1c;
    bottom: 0;
    box-sizing: border-box;
    font-size: 22px;
    margin: 0;
    padding: 8px 14px;
    position: absolute;
    transition: background 0.3s ease-out 0s;
}
.box.header .nspImageWrapper h4 a {
    color: #fff;
}
.box.header .nspImageWrapper h4:hover {
    background: none repeat scroll 0 0 #e25b32;
}
.box.header .nspImageWrapper h4 a:active, .box.header .nspImageWrapper h4 a:focus, .box.header .nspImageWrapper h4 a:hover {
    color: #fff;
}
.box.header .nspLinks .nspLinkScroll1 div ul li {
    margin: 0 10px !important;
    padding: 14px 0 !important;
    transition: all 0.3s ease-out 0s;
}
.box.header .nspLinks .nspLinkScroll1 div ul li:hover {
    background: none repeat scroll 0 0 #e25b32;
    color: #fff;
    margin: 0 !important;
    padding: 14px 10px !important;
}
.box.header .nspLinks .nspLinkScroll1 div ul li:hover h4, .box.header .nspLinks .nspLinkScroll1 div ul li:hover h4 a {
    color: #fff;
}
.arrow .nspLinks .nspLinkScroll1 div ul li {
    background: url("../images/arrow_bullet.png") no-repeat scroll 0 3px transparent;
    border: medium none;
    padding: 0 0 16px 20px;
}
.arrow .nspHeader {
    font-size: 18px;
}
.bigtitle p.nspInfo {
    font-size: 12px;
}
.bigtitle .nspHeader {
    font-size: 20px;
}
.bigtitle p.nspText {
    font-size: 14px;
}
.bigtitle .nspArt {
    border-top: 1px solid #e5e5e5;
}
.bigtitle .nspArt:first-child {
    border-top: medium none;
}
.bigtitle .nspTopInterface div {
    padding: 0 3px;
    position: absolute;
    right: 16px !important;
    top: 24px !important;
}
.box.headlines .nspLinks .nspLinkScroll1 div ul li {
    border-bottom: 1px solid #e5e5e5;
    border-top: medium none;
    padding: 20px 0;
}
.box.headlines .nspLinks .nspLinkScroll1 div ul li:hover {
    background: none repeat scroll 0 0 #f8f8f8;
}
.box.headlines .nspBotInterface div {
    float: none;
    margin-top: 12px;
    text-align: center;
}
.box.headlines .nspBotInterface div ul {
    display: inline-block;
    float: none;
}
.nsphover .content {
    margin: 0 -12px;
}
.nsphover .nspImageWrapper {
    position: relative;
}
.nsphover .nspInfo2 {
    background: none repeat scroll 0 0 #e25b32;
    color: #fff;
    display: block;
    font-size: 12px;
    left: 0;
    line-height: 12px;
    margin: 0;
    padding: 12px 14px;
    position: absolute;
    text-transform: uppercase;
    top: 0;
}
.nsphover .nspInfo2 a {
    color: #fff !important;
    margin: 0 !important;
    padding: 0 !important;
}
.nsphover .nspInfo2 a:hover, .nsphover .nspInfo2 a:focus, .nsphover .nspInfo2 a:active {
    color: #ddd !important;
}
.nsphover .nspArt {
    border: medium none !important;
    margin: 26px 0 0;
    overflow: hidden;
    position: relative;
}
.nsphover .nspText {
    bottom: -200px;
    position: absolute;
}
.nsphover .nspHoverOverlay {
    background: none repeat scroll 0 0 #e25b32;
    box-sizing: border-box;
    height: 600px;
    margin: 0 15px 0 0;
    padding: 56px 20px 0;
    position: absolute;
    top: 100%;
    transition: top 0.3s ease-out 0s;
    z-index: 9;
}
.nsphover .nspHoverOverlay .nspText, .nsphover .nspHoverOverlay .nspText a {
    color: #ffbfab;
    margin-top: 10px;
    position: static;
}
.nsphover .nspHoverOverlay .nspText a:active, .nsphover .nspHoverOverlay .nspText a:focus, .nsphover .nspHoverOverlay .nspText a:hover {
    color: #fff;
}
.nsphover .nspHoverOverlay .nspHeader, .nsphover .nspHoverOverlay .nspHeader a {
    color: #fff;
}
.nsphover .nspHoverOverlay .nspHeader a:active, .nsphover .nspHoverOverlay .nspHeader a:focus, .nsphover .nspHoverOverlay .nspHeader a:hover {
    color: #ffbfab;
}
.nsphover .nspInfo {
    position: relative;
    z-index: 10;
}
.nsphover .nspInfo2 {
    left: 15px;
    position: absolute;
    z-index: 10;
}
.nsphover .nspHoverOverlay.active {
    top: 0;
}
.nsphover .nspInfo1 {
    transition: all 0.3s ease-out 0s;
}
.nsphover .nspInfo1.active {
    color: #fff;
    margin-left: 20px;
}


I can see You have used NSP GK4 and GK5 modules. In such case You may have some problems. This is basicaly the same module just a different version and it was not meant to be working together. It does the same, so just stick to one of the versions.
User avatar
Moderator

GK User
Thu Dec 04, 2014 10:28 am
Hi, I understand. The code did not help a lot, but thank you for trying. I'll just stick to the other image component.
User avatar
Gold Boarder

teitbite
Fri Dec 05, 2014 11:12 am
Hi

Yes, unfortunately there are same classes in template You have, so some get override or having too many properties. Not an easy action to do. I think it will be better to use some 3rd party extension.
User avatar
Moderator

GK User
Fri Dec 05, 2014 4:39 pm
I understand, thanx!

There is another problem I have on the www.islamqa.no site, but I am sure what the reason is. The articles are not being correctly indexed by google, I think. I was hoping you could help locate the problem.

I am using Custom Search Engine to search on my site, but it is not finding all articles.

Let's take this article as an example called ''Sufisters dans og sang'':

I can see it here: https://www.google.no/search?q=site%3Ai ... 8Qe24YGQCw

But not here: http://islamqa.no/avansert-sok/norsk?se ... ng&areaid=

I have not choses to exclude it from my CSE either. Where is the problem coming from and how can I solve it without changing the alias of the category and have google re-index it?

I really do appriciate it if you can help me solve this issue.
User avatar
Gold Boarder

teitbite
Sun Dec 07, 2014 6:05 pm
Hi

I'm sorry, but I do not know this extension so will not be much help here. You need to ask its developer for help. What type of the article is that? A joomla regular article or K2 maybe? It's possible that his module needs to be configured to include this type or articles in results or need an extra plugin.
User avatar
Moderator

GK User
Mon Dec 08, 2014 3:02 pm
Hi, thanx! It is not really a problem in the module, it is google custom search that is not finding the articles. So I was thinking maybe there could be any template configuration that would make google index correctly? It is K2 articles.
User avatar
Gold Boarder

teitbite
Tue Dec 09, 2014 11:51 am
Hi

I do not know of anything in template affecting this, but make an easy test. Try change template to default joomla one and check it than.
User avatar
Moderator


cron
Remember me
Register New Account
If you are old Gavick user, click HERE for steps to retrieve your account.