Joomla Templates Club 406,261 posts

[Paul Peters Friend Paul PetersJoin date: September 2014Posts: 3Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#192463

Hi,

I’m having some problems with the JA Masshead. I’ve tried to set a background image to it, but I can’t get it to work.
Hopefully there’s someone that can help me out.

Also for the articles when I set an background image to an article and I click on it, it shows me the grid picture. How do I get to the article itself?

Thanks a lot.

pjpprojects

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#513270

Hi,

In order to make the JA Masshead module to display fine the background image on selected page, you will need to edit a little bit the module layout as we mentioned in the module documentation.

However, in this case I do attached the override layout of this module so that you just need to download and extract to templates/ja_fixel/html/ folder.

<blockquote>Also for the articles when I set an background image to an article and I click on it, it shows me the grid picture. How do I get to the article itself? </blockquote>

On this question, it will be great if you can put the site’s url here or send me PM. I will help you to check it and back to reply you with any suitable suggestion if possible.

---

Attachments:

1. mod_jamasshead.zip

[petero Friend peteroJoin date: December 2011Posts: 30Downloads:1Uploads:3 Thanks: 5]

#513278

For the life of me I do not see what the Masshead is for and what it does beyond being a complicated way to show images or text which can be done much more simply using other methods.

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#513292

Hey guys,

By default, the JA Masshead module is used to display the masshead titles with the descriptions and background images on different menu item pages. And this module is one of the extensions used regularly on our template demos.

I need to say that It will take some time to override the layout to display the background images on each template. However, in my point of view, that is the flexibility of the module which allows you to customize on override module layout to fit on different template layouts.

[palos Friend palosJoin date: January 2013Posts: 369Downloads:37Uploads:8 Thanks: 125 Thanked: 27 times in 7 posts]

#513844

Hi there, I feel the same as petero mate.
Moreover the masshead description is encoded… or rather miscoded.
It is not UTF-8 – what it must be – so when you use some foreign language it loose ALLCAPS and turn into Sentence case.
Of course you can get “?” instead of the the proper character. It is caused by the improper charset definition.
Please count with the wallet of those “latin extended” guys too. 😉

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#514078

Hi palosutca,

Thank you for your suggestion. I will transfer this comment to our extension developer to check out the encoding of the non UTF-8 charset (latin extended) on the Slideshow module.

However, you can simply solve this issue with below steps:

– Make sure that you installed the Joomla language package which you are using its characters to display the descriptions.
– Using a UTF-8 encoder (Notepad ++) to encode the text format before entering into the description box of slide images.

---

Attachments:

1. 

[palos Friend palosJoin date: January 2013Posts: 369Downloads:37Uploads:8 Thanks: 125 Thanked: 27 times in 7 posts]

#517530

Thanks but it had to be completly recoded in mysql :((

I have a silly problem too as I am unable to set an image for masshead background.
Followed the code in the documentation but does not work:
[Masshead Itemid=”238″ title=”Using Format 2r” background=”images/stories/masshead/mh-5.jpg“]Display Masshead in defined page id = 238 and 499[/Masshead]
I just created the path above for testing purpose also but nothing changed.
The sad point of the “behavior” of the masshead thing that when I check it by firebug or inspect the element in chrome it does not show that missing any picture. Just empty. So It cannot be discovered if a mistype or a bad path caused the problem.

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#517533

Hi palosutca,

In order to show the background image on JA Masshead module as you expected, normally you will need to override the layout of this module on current template. However, you can extract my attached folder to templates/ja_fixel/html/ path. Then check out the masshead makeup again.

---

Attachments:

1. mod_jamasshead.zip

[palos Friend palosJoin date: January 2013Posts: 369Downloads:37Uploads:8 Thanks: 125 Thanked: 27 times in 7 posts]

#517547

Thank You Leo,
It seems that we are closer to the solution but still shows only a small window with an amazing huge 80px padding around and some more css lines waiting for override…

Where is the bogeyman? Why does not it work out of the box after reading and applying the “official guide”?
:((

Just sent a pm also but nothing shows up at my profile > sent messages except for this one: Showing Messages 1 to 1 of 1:-[

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#517550

Hi palosutca,

Just go a head with overriding the css style. If you still need my help in this case, you can PM me the site’s url. I will take a look and give you more accurate css styles.

<blockquote>Where is the bogeyman? Why does not it work out of the box after reading and applying the “official guide”?</blockquote>

The override layout of the JA Masshead module just exists on the templates (i.e JA University) that you use it to display the Masshead background image on the template demo. While on JA Fixel template, our developer uses the Module class suffix to display the background, instead of overriding the module.

So, the detailed steps on how to modify this module layout was not included into the module’s userguide.

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#517771

I have checked the Masshead module on your website and found that the module is restricted inside the <article> section of item grid on Homepage, thus the background image will not display fully the module area.

Another fix for this is to use the override css styles to display the background image fully on Masshead module section only. You can try to the followings:

– Rename the folder templates/ja_fixel/html/mod_jamasshead/ to mod_jamasshead_bk (i.e)

– Go to the backend of module, and fill into Module class suffix with the text “bg-masshead“. Make sure you leave a space before this text.

– Create a custom.css file at path templates/ja_fixel/css/ and add css styles below:

.fixel-grid .items.bg-masshead article {
background-image: url('/project/magart_f/images/kertepito/logo_600.jpg');
}

.t3-module.highlight.bg-masshead {
background: none;
}


The snapshot below shows how the Masshead module looks like at my end with above-mentioned tweak.

---

Attachments:

1. 

1 user says Thank You to phong nam for this useful post

1. palos

[bigmagic2014 Friend bigmagic2014Join date: December 2013Posts: 65Downloads:0Uploads:6 Thanks: 15 Thanked: 2 times in 1 posts]

#517857

Hello, I’m a little new so bare with me.

First of all, is a masshead the same thing as a banner? If not what’s the difference and why do you call it a masshead?
2)I How do you customize the masshead? I can’t turn title (Hi) into two words separated by space without it disappearing. Also want to change size and font. Seems like I have to go way small or keep the gigantic font.
3) How do I change title font and size? I hear I can also get a picture back there instead of the basic orange and green, etc. I haven’t even found where the code for the color is, aside from where the image would attach.

Can somebody help me out here? I want to adjust Title text to multiple words with space in between — Title size to smaller (but bigger than H2,H4 etc) and change Font (probably to a script type). Also would like to use image as background if possible.

I can change the rest without too much of a problem, but the Title (Hi) is the thing that’s been bogging me down. Also be nice to change the padding etc.

One more thing, I’m using the custom demo while building my site but I’ve notice it seems really buggy. I registered for a second site but it’s appears a little buggy also. (You have repeat the same command a number of times before it takes or it will log you out etc). How can this be fixed? Do I just register for a new demo trial? Would the same thing continue to happen?

Seems like a really nice template so far though, other than the above mentioned.

Let me know what you come up with guys
thanks

[phong nam Friend phong namJoin date: May 2015Posts: 3779Downloads:1Uploads:587 Thanks: 499 Thanked: 974 times in 888 posts]

#518020

Hope my answers would be of help:

1. is a masshead the same thing as a banner? If not what’s the difference and why do you call it a masshead?

JA Masshead module is used to display the masshead (highlighted) title of a page. However, you can modify the module layout to display different titles, descriptions and background images.

Meanwhile, banner is just a simple picture without either flexible titles or descriptions.

2/3 I How do you customize the masshead? I can’t turn title (Hi) into two words separated by space without it disappearing. Also want to change size and font. Seems like I have to go way small or keep the gigantic font.

In this case, I suggest you to follow the guide to display the background image inside <article> , instead of customizing the Masshead module layout.

The reason is that on the homepage of JA Fixel, the module background size is restricted by the item grid size so the background image will be cut out.

In addition, you can change the font and size of Masshead elements by opening templates/ja_fixel/css/template.css file, then find lines:

.jamasshead .jamasshead-title {
font-family: 'novecento_widedemibold', sans-serif;
font-size: 150px;
font-weight: normal;
line-height: 1;
margin: 0;
text-indent: -13px;
word-spacing: -30px;
}
.jamasshead .jamasshead-description {
font-size: 16px;
font-weight: 300;
}
.jamasshead .jamasshead-description h3 {
font-family: 'novecento_widedemibold', sans-serif;
font-size: 30px;
font-weight: normal;
line-height: 1.3;
margin: 0 0 20px;
width: 80%;
}

And change the font-family, color and size as you wish. Make sure to backup the file before editing.

As for the demo question, could you explain in more detail which problems you are getting? Any snapshots would be helpful as well.

[palos Friend palosJoin date: January 2013Posts: 369Downloads:37Uploads:8 Thanks: 125 Thanked: 27 times in 7 posts]

#518056

Thank you Leo,

As I am working on an other site and had to come up with a solution before your post so finally I ended up with an other way to solve the problem. While I had to use a dozen of 2×2 grid “first image” with different backgrounds just simply created Custom HTML Modules (added suffix to get them at the first grid position). I think it was not more amount of job as I would have created a dozen of CSS with different lines about the specified background images.

1 user says Thank You to palos for this useful post

1. phong nam

[Author]

Posts