Alignment of some variables

Florian
(@10bestseller)

2 years, 5 months ago

Hi Michael,

I really like the advantages of Auto Amazon Links and needs your help.

I am using the current format for product visualization.
—
div class=”amazon-auto-links-product-body”

%discount%
%title%
%description%
%price%
%prime%
%button%
——
The most of the variables are organized on left-margin side. How can I add html to get the variable on right-margin.

With Global CSS I used this working example
.offered-price {
float:right !important;
}

But I don’t want to use it globally and needs adjustment only for some Auto Amazon Links and use something like with
p align=”right”

Thanks for your help

Kind regards

Florian

Viewing 3 replies - 1 through 3 (of 3 total)

Plugin Author miunosoft
(@miunosoft)

2 years, 5 months ago
Hi,

It depends on the plugin template. For the List template, you can try this.
```
.amazon-product-container .offered-price {
    float: right;
}
.amazon-product-container p {
    text-align: right;
}
```
Instead of .amazon-product-container, you can use .amazon-auto-links but the .amazon-auto-links selector is planned to be deprecated so I suggest you use the former.

By the way, you might want to use flex instead of float if you don’t mind dropping support for old browsers.
Thread Starter Florian
(@10bestseller)

2 years, 5 months ago

Thank you for your proposal and fast answer.

With CSS its always global and I can’t make a difference between “Carousel” and “Lists”.

In “Carousel” I added a buy-button, but it should centered.
In “Lists” I have a buy-button, but it should be on the right side.

With CSS it’s always side-wide configured. So it would good to change it in a unit configuration. Something like this in the “Output Formats” Section.

div class=”amazon-auto-links-product-body”
p align=”right” %button%

Then, I would be able to control it by each unit, how it should looks like. Maybe there is a way.

Thank you

Florian
Plugin Author miunosoft
(@miunosoft)

2 years, 5 months ago
Or, in the Output Format unit option, you can enclose the existing HTML elements with your own div tag like,
```
<div class="your-custom-selector">
    <div class="amazon-auto-links-product">    
        <div class="amazon-auto-links-product-image">%image%
        </div>
        <div class="amazon-auto-links-product-body">        %title% %rating% %prime% %discount% %price% %disclaimer% %description%
        </div>
    </div>
</div>
```
Then, in your stylesheet, add something like,
```
.your-custom-selector .offered-price {
    (define your own rules)
}
```
Of course, your-custom-selector can be your desired string.

Hope this helps.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Alignment of some variables’ is closed to new replies.

Tags