django-reaktion-banner 0.0.8

Description:

djangoreaktionbanner 0.0.8

Banner
Reaktion's banner plugin for Django
Setup
Project requirements.txt

The following need to be installed in the environment & be in the requirements.txt:

pytz
djangorestframework
pillow
icecream



Project Settings

Add "banner" to your INSTALLED_APPS setting like this:

INSTALLED_APPS = [
...

'banner',

]


Add the following context processors to your OPTIONS in TEMPLATE settings and add a banner endpoint variable:

'OPTIONS': {
'context_processors': [
...
'banner.processors.banner_endpoint',
'banner.processors.banner_sidebar_right',
'banner.processors.banner_sidebar_left',
'banner.processors.banner_content',
'banner.processors.banner_bottom',
'banner.processors.banner_top'
]
}

BANNERS_ENDPOINT = os.environ['BANNERS_ENDPOINT']


Include the banner URL conf in your project urls.py like this::

path('banner/', include('banner.urls')),
path('api/', include('banner.api_urls', namespace='banner-api')),

Project css/scss

Define the css styles in styles.scss

.sticky-top-alt {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1020;
}

.label-over-ad {
position: absolute;
top: 0;
left: 0;
font-weight: 700;
font-size: 10px;
padding: 3px 10px 3px 10px;
background: #135776;
border-radius: 0 1px 1px 0;
opacity: 0.80;
color: white;
border-bottom: 0;
font-family: "Raleway";
}

.panorama-ad-div {
width: 100vw;
height:auto;
max-height: 240px;
object-fit: cover;
background: #135776;
&:hover {
cursor: pointer;
}
}

.panorama-ad-image {
display: block;
width: 100%;
height: auto;
max-height: 240px;
object-fit: cover;
aspect-ratio: 0;
}

.leaderboard-ad-div {
width: 100vw;
height:auto;
max-height: 90px;
object-fit: contain;
&:hover {
cursor: pointer;
}
}

.leaderboard-ad-image {
display: block;
width: 100%;
height: auto;
max-height: 90px;
object-fit: contain;
aspect-ratio: 0;
}

.skyscraper-ad-left-div {
max-width: 160px;
&:hover {
cursor: pointer;
}
}

.skyscraper-ad-left-image {
max-width: 160px;
aspect-ratio: auto!important;
}

.skyscraper-ad-right-div{
max-width: 160px;
}

.skyscraper-ad-right-image{
max-width: 160px;
aspect-ratio: auto!important;
&:hover {
cursor: pointer;
}
}

Run python manage.py migrate to create the banner models.

For a docker environment run the following two commands:

docker exec <container name> python cms/manage.py migrate
docker exec <container name> pip install -r requirements.txt