Joomla Templates Club 406,261 posts

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#203008

Hello Joomlart Support Team,

I have two issues:

– My Main Menu is misbehaving having a bug on many devices(Windows, IOS, Android, Apple, Mobile) as my customers and users have reported to me. It happens on wider screens but also on small tablets and makes the website just look amateur. See screenshots.
Can you help me stabilize the Main Menu to look alike on all devices, see Screenshot 1

Screenshot 1: The Menu is perfect, this is how it should look like

Screenshot 2: NOT GOOD

– I will like to insert a “Read More” Link in my starred articles, see under my blog, when you hove-over a picture i want an introduction to the article and the read more button. See screenshot for the issue.

Pic 1: The picture

Pic 2: When you hover the text is cut…not good.

Thank you for your support (-:

---

Attachments:

1. 
2. 
3. 
4. 

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556426

1. The Menu ís too long, so there is no enough space to display them in a line. In order to display the menu correctly, you should reduce the number of root Menu items

2. You can add this code to the file root/template/ja_fixel/css/custom.css (create a new file if unavailable)

.fixel-grid .items.image.rotateY article .item-desc .article-intro, .fixel-grid .items.image.rotateX article .item-desc .article-intro {
display: block !important;
}

.fixel-grid .items.image.rotateY article .back .article-intro {
height: 100% !important;
}

3. If the issue still persists, kindly provide temporary admin account. I can have a closer look

1 user says Thank You to Eragon H for this useful post

1. vigonace

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#556461

@eragon H admin account access has been provided, i need support on this Menu issues.

1. I can’t reduce the root menu items. Isn’t there a way to make the font size change when needed, the social link button and Logo float to give more space without breaking the layout?

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556467

1. I can’t edit the file custom.css due the permission issue >> http://prntscr.com/59xtoc

2. You can try these code to the custom.css to fix the issue with Main Menu

.social-link {
right: 0 !important;
}

.logo.logo-image {
margin-left: auto !important;
margin-right: auto !important;
}
@media (min-width: 980px) and (max-width: 1040px) {
.t3-mainnav .navbar .nav > li > a {
font-size: 12px !important; }
}
@media (min-width: 1041px) and (max-width: 1200px) {
.t3-mainnav .navbar .nav > li > a {
font-size: 13px !important; }
}

1 user says Thank You to Eragon H for this useful post

1. vigonace

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#556470

Roger that!

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#556479

@eragon H Thank you, i updated the custom.css file permission.

Just noticed 2 bugs again. I’ll take the shot and ask you for help again unfortunately.

– On The blog, the simple text articles are still cut maybe also do the same as above, plus i would like the “create date” “Autor” and “Category” not to be displayed under the Blog Menu item, only when the article is fully displayed for “read more”.
“create date” “Autor” and “Category” distract the visitor and potential customer from the message and intention to build a relationship with him/her.

Screenshot 1:

– I disabled my Banners because many customer block them and i’m not doing any advert for anyone else than my business.

Instead i enabled two slideshow modules there for my adverts as they should be visible at all time and don’t need trackers, but they do not appear on mobile devices(iPhone, Smartphones), how can we make it happen re-mediate to that. Customers need advert. it looks more professional. and they do shopping with their mobile devices(iPhone, Smartphones).

Screenshot 2:

---

Attachments:

1. 
2. 
3. 

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#556485

Hey @eragon H, you are fast :D:D:D:D:D

Tkanks for working so hard on it (-:

---

Attachments:

1. 
2. 
3. 

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556486

1.
a. change the padding of the articles to the border

.fixel-grid .items.text .article_content {
padding: 20px !important;
}

b. change the height of intro text

.fixel-grid .items.text .article_content .article-intro {
height: 100% !important;
max-height: 100% !important;
}

c. Hide the created-date, author and category

.fixel-grid .items.text .article_content .article-aside {
display: none !important;}

Result: http://prntscr.com/59yykx

d. You can add this code to optimizing the view of simple text article in mobile and tablet

@media (max-width: 979px) {
.fixel-grid .items.text .article_content {
margin: -10px !important;
}

.fixel-grid .items.text .article_content .article-title {
font-size: 15px !important;
}

.fixel-grid .items.text .article_content .article-intro {
font-size: 12px !important;
}

.fixel-grid .items.image.rotateY article .back, .fixel-grid .items.image.rotateX article .back {
padding: 10px !important;
}

.fixel-grid .items.image.rotateY article .back .article-intro, .fixel-grid .items.image.rotateX article .back .article-intro {
font-size: 12px !important;
}

.fixel-grid .items.image.rotateY article .item-desc h2, .fixel-grid .items.image.rotateX article .item-desc h2 {
font-size: 15px !important;
}
}

Note: You can change the value “padding”, “height”, “margin” and “font-size” above to meet your need

2. I can see the slideshow appear in mobile: http://prntscr.com/59yywj

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#556494

VIELEN DANK @eragon H.

I’m more than satisfied. I’ll close the thread. All the issues where solved to my satisfaction.
Thank you for the prompt support.

Grüßle aus Köln.

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#557538

Hey guys, hi @eragon H there is still a last bug.

I tried to fix it the past few days but i have no clue what i’m doing and where and what to do.

It is the logo. When reducing the dimension of the web-Window, the transition from normal to mobile devices isn’t smooth and the Logo is cut or only half displayed. Can we manage to fix that so the logo is displayed properly at all stages? That is the purpose, it is a little issue with the div.Brand i guess… see Screenshot.

Screenshot Logo:

While fixing, try to zoom in and out and see how the Menu behave on different devices and also reduce the size of the window to see how it displays on mobile devices to understand me and why we haven’t solve this issues yet.

Also the Social Link. I know, no one has such a wide screen but here in Germany they do. So can we manage also here to have the “+” at all stages and only shows the socials(Facebook, instagram…) only when hover over it?

Screenshot Social:

THANKS GUYS!!!

---

Attachments:

1. 
2. 
3. 

[vigonace Friend vigonaceJoin date: February 2012Posts: 51Downloads:6Uploads:25 Thanks: 19 Thanked: 7 times in 1 posts]

#557576

My solution was here:

http://www.joomlart.com/forums/topic/having-trouble-re-sizing-the-logo/

[Author]

Posts