The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How would i do this?

View previous topic View next topic Go down

How would i do this?

Post by INEEDHELPWITHBADGES on April 2nd 2012, 9:18 am

I want to make a news section thats the default homepage with articles with a picture and a description of the article and then when you click the title it expands the article

INEEDHELPWITHBADGES
New Member

Posts : 19
Reputation : 1
Language : English

Back to top Go down

Re: How would i do this?

Post by E-Mark on April 2nd 2012, 9:30 am

Where you want to put/display it? Homepage?

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Re: How would i do this?

Post by INEEDHELPWITHBADGES on April 2nd 2012, 9:51 am

@E-Mark wrote:Where you want to put/display it? Homepage?
Homepage

INEEDHELPWITHBADGES
New Member

Posts : 19
Reputation : 1
Language : English

Back to top Go down

Re: How would i do this?

Post by E-Mark on April 2nd 2012, 10:02 am

A simple one Wink.
Go to ACP > Display > Homepage > Generalities > Homepage Message:

Code:
<p class="text"><img src="IMAGE URL GOES HERE" /> <a href="#">DISPLAY MESSAGE GOES HERE</a></p><br><div class="message">
<p>CONTENT GOES HERE</p>
</div>

Go to ACP > Display > Pictures and Colors > Colors > CSS Stylesheet:
Code:

div.message,p.text {
margin:0px;
padding:5px;
text-align:center;
background:#fff;
border:solid 1px #111;
}
div.message
{
height:--px;
display:none;
}

Go to ACP > Modules > HTML and Javascript > Javascript Management > Create:

Fill the following

Title: (Anything you want)
Placement: In homepage
Javascript Code:
Code:

$(document).ready(function(){
$(".text").click(function () {
      $(".message").slideToggle("slow");
    });
});

Note: Change the "height:--px;" in the CSS Stylesheet.
Wink

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Re: How would i do this?

Post by INEEDHELPWITHBADGES on April 3rd 2012, 8:52 am

@INEEDHELPWITHBADGES wrote:
@E-Mark wrote:Where you want to put/display it? Homepage?
Homepage
I do this but when i click on the article it doesnt display the content

INEEDHELPWITHBADGES
New Member

Posts : 19
Reputation : 1
Language : English

Back to top Go down

Re: How would i do this?

Post by E-Mark on April 3rd 2012, 9:07 am

Remove the CSS Code i gave you in the CSS Stylesheet.
Then put this in the Homepage Message after the code i gave before.
Code:

<style>
div.message,p.text {
margin:0px;
padding:5px;
text-align:center;
background:#fff;
border:solid 1px #111;
}
div.message
{
height:100px;
display:none;
}
</style>

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Re: How would i do this?

Post by INEEDHELPWITHBADGES on April 3rd 2012, 9:14 am

@E-Mark wrote:Remove the CSS Code i gave you in the CSS Stylesheet.
Then put this in the Homepage Message after the code i gave before.
Code:

<style>
div.message,p.text {
margin:0px;
padding:5px;
text-align:center;
background:#fff;
border:solid 1px #111;
}
div.message
{
height:100px;
display:none;
}
</style>
still doesnt work bwi

INEEDHELPWITHBADGES
New Member

Posts : 19
Reputation : 1
Language : English

Back to top Go down

Re: How would i do this?

Post by E-Mark on April 3rd 2012, 9:42 am

Did you enable the JS Management? Shocked

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

Re: How would i do this?

Post by INEEDHELPWITHBADGES on April 3rd 2012, 9:45 am

@E-Mark wrote:Did you enable the JS Management? Shocked
how bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi bwi

INEEDHELPWITHBADGES
New Member

Posts : 19
Reputation : 1
Language : English

Back to top Go down

Re: How would i do this?

Post by E-Mark on April 3rd 2012, 9:50 am

Go to Admin CP > Modules > HTML and Javascript > Javascript codes management:

Find:
Enable Javascript codes management: Yes (Set it to Yes)
Then Save.

Screenshot:

E-Mark
Active Poster

Male Posts : 1389
Reputation : 164
Language : English, Tagalog
Location : Republic of the Philippines

http://coding-spot.darkbb.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum