[8WR] XenPorta (Portal) PRO

[8WR] XenPorta (Portal) PRO [Paid] 1.2.2b

No permission to buy ($40.00)
Can anyone please point me in the right direction to change the CSS for:

  • Article border box
  • Header and Footer Colour
  • Date Block colour

I haven't read through the entire thread but how far off having some style properties available for the add-on ?

Thanks.
These are the changes I made:
upload_2015-1-21_12-19-17.webp

I'm not good at this so I will do the best I can to explain only what I did, but maybe it will help you in some way, added code to Extra.css:

This changes the border on hover:
Code:
/* This adds a hover border effect to articles */
.articlesGrid .articleItem .sectionMain:hover
{
border: 1px solid rgb(160, 160, 160);
}

Change color of white date block:
Code:
/* This makes white date block a gradient */
.articleItem .dateBlock .secondaryContent
{
background: linear-gradient(rgb(173, 173, 173), white);
border-top: 2px solid black;
}

Make header a gradient:
Code:
/* Add very slight gradient to header */
.subHeading {
background: linear-gradient(rgb(236, 237, 238), white);
}

Hope this helps,
CM
 
Last edited:
Is it possible to have just a list of Article titles, like a menu of articles, in the sidebar?

I thought the ArticlesSimple.xml widget would do that, but it doesn't

Thanks
 
google adsense is controlling the actual width of the ad according to style you selected .. just use the CENTER tags to center your ad in the block. make changes with the ad code section, not the widgets settings themselves but in the ad code section
If I remember correctly, 970px is widest banner ad obtained through the adsense service.

additionally, the widget is conforming to the container that you are selecting from your layout. A template modification might be more appropriate to accomplish what you are trying to do.

Yes I know that.. I have chosen the 728 x 90 banner ad, but you can't do any other changes to the code there.. I have tried to use a raw html block to add the gooogle code in the center tags as you mentioned above, but it did nothing. (still the same problem with overlapping block).
 
These are the changes I made:
View attachment 95653

I'm not good at this so I will do the best I can to explain only what I did, but maybe it will help you in some way, added code to Extra.css:

This changes the border on hover:
Code:
/* This adds a hover border effect to articles */
.articlesGrid .articleItem .sectionMain:hover
{
border: 1px solid rgb(160, 160, 160);

Change color of white date block:
Code:
/* This makes white date block a gradient */
.articleItem .dateBlock .secondaryContent
{
background: linear-gradient(rgb(173, 173, 173), white);
border-top: 2px solid black;
}

Make header a gradient:
Code:
/* Add very slight gradient to header */
.subHeading {
background: linear-gradient(rgb(236, 237, 238), white);

Hope this helps,
CM
Thanks CM this has got my in the right area. Ive managed to get the border around the article and matched it to my style. Whats the setting to have that on permanent and not via hover?

Also no matter what I do I can't seem to get the header gradient to change from whats there. Does anything need doing in the style rather than EXTRA.css?

I am not using the masonry grid currently.
 
Thanks CM this has got my in the right area. Ive managed to get the border around the article and matched it to my style. Whats the setting to have that on permanent and not via hover?

Also no matter what I do I can't seem to get the header gradient to change from whats there. Does anything need doing in the style rather than EXTRA.css?

I am not using the masonry grid currently.
Remove the :hover from the code:
Code:
/* This adds a hover border effect to articles */
.articlesGrid .articleItem .sectionMain:hover
{
border: 1px solid rgb(160, 160, 160);
}

Seemed to work for changing the color of the header:
Code:
.subHeading.singleLine {
background-color: black
}
upload_2015-1-21_15-26-30.webp
 
Remove the :hover from the code:
Code:
/* This adds a hover border effect to articles */
.articlesGrid .articleItem .sectionMain:hover
{
border: 1px solid rgb(160, 160, 160);
}

Seemed to work for changing the color of the header:
Code:
.subHeading.singleLine {
background-color: black
}
View attachment 95674
Thanks CM nearly there :)

Any ideas where the CSS is to change the category and continue blocks? Also, what resolution and crop settings have you used for the slider, looks good.
 
Thanks CM nearly there :)

Any ideas where the CSS is to change the category and continue blocks? Also, what resolution and crop settings have you used for the slider, looks good.
Don't know for sure man as I'm a noob too as this, but it does look like .continue .button can change the color...

I have to head out though, I'm not a ninja at this like some of the other guys but just trying to help out when I can. Someone with more experience will have to help you with the categories.
Cheers,
CM
 
Don't know for sure man as I'm a noob too as this, but it does look like .continue .button can change the color...

I have to head out though, I'm not a ninja at this like some of the other guys but just trying to help out when I can. Someone with more experience will have to help you with the categories.
Cheers,
CM
No problem, thanks so much.
 
Yes I know that.. I have chosen the 728 x 90 banner ad, but you can't do any other changes to the code there.. I have tried to use a raw html block to add the gooogle code in the center tags as you mentioned above, but it did nothing. (still the same problem with overlapping block).

try template modification to the PAGE_CONTAINER template, place your add below bottom breadcrumb

Use ad_below_bottom_breadcrumb template to do what you want!
 
Last edited:
@Jaxel Is it possible to style the article widget from the main page with an other style than the one from the category page? I'm not on my pc and I'm working with a mac atm so I don't have the faith to try to find out by myself how to do with the touch pad :/
 
@Jaxel Is it possible to style the article widget from the main page with an other style than the one from the category page? I'm not on my pc and I'm working with a mac atm so I don't have the faith to try to find out by myself how to do with the touch pad :/
You can force styles on categories.
 
I have a qustion about a new layout i have made.

The template = EWRporta2_ArticleList
In the layout i have the widget: Articles Simple, Features main.
How can i disable the "default"Features slider and articles lines, because i have now 2 sliders and 2 times the promoted articles.
I prefer to view only the widgets Articles Simple and Features main.
 
Top Bottom